【问题标题】:Use span instead of label in rails在 rails 中使用 span 而不是 label
【发布时间】:2012-12-31 09:19:13
【问题描述】:

使用:

 <%= f.label :registration,"Registration" %>

将创建一个标签:

&lt;label for="cad_registration"&gt;Registration&lt;/label&gt;

我希望它是一个像这样的跨度:

&lt;span for="cad_registration"&gt;Registration&lt;/span&gt;

【问题讨论】:

  • 那么不要f.label,而是写一个span?

标签: html ruby-on-rails ruby-on-rails-3 forms


【解决方案1】:

&lt;span&gt; 元素不支持for 属性。因此,使用 &lt;span&gt; 元素而不是 &lt;label&gt; 是没有意义的。

为什么不使用 (CSS) 样式将 &lt;label&gt; 设置为所需的结果? 如果您只想设置此特定元素的样式,请使用 id-attribute。

例如使标签文本变为红色,使用如下代码:

ERB:

<%= f.label :registration,"Registration", :html => { :id => "my-label" } %>

CSS:

#my-label {
    text-color: red;
}

【讨论】:

  • 我想我需要让我的设计师使用标签而不是跨度:)。
  • 如果您需要label for 表单域:是的! :)
【解决方案2】:

那么你不是在创建标签,你不应该使用 label 助手。 for 属性在 &lt;span&gt; 元素上不存在。

用你写的底线替换你的代码,但没有for

<span>Registration</span>

【讨论】:

    【解决方案3】:

    您可以使用自定义表单构建器来修改表单标签的输出方式以满足您的要求。这里有一个简短的概述 - http://code.alexreisner.com/articles/form-builders-in-rails.html。还有一个关于这个主题的Railscast,它更彻底,但它是一个专业(付费)剧集。

    【讨论】:

    • 不允许有一个包含for-属性的&lt;span&gt;-元素。所以创建自定义表单生成器并不能解决问题...
    【解决方案4】:

    我想出了以下解决方案,扩展 Rails FormBuilder

    在您的应用程序助手中

    module ApplicationHelper
      class TestFormBuilder < ActionView::Helpers::FormBuilder
            include ActionView::Helpers::TagHelper
    
            def span(name, options = {})
              css_classes = []
              css_classes = options[:class].to_s if options[:class]
              content_tag('span', name, :class => css_classes.join(' '))
            end
      end
    end
    

    在你看来你可以使用

    <%= form_for @<module>, :builder => ApplicationHelper::TestFormBuilder do |f| %>
      #your code 
      <%= f.span(:name) %>
    <% end %>
    

    这很有效,感谢您提出的问题,这让我想到了扩展 FormBuilder ;),

    这些链接帮助了我link1link2,你可能还想做一些修改

    HTH

    【讨论】:

    • 非常感谢您的时间和回答.. 我会检查一下。这是个好主意。
    【解决方案5】:

    只需写下 ruby​​ 之外的跨度

    <span for=<%= :registration %>><%="Registration"%></span>
    

    【讨论】:

    • 不允许有一个包含for-属性的&lt;span&gt;-元素。所以创建自定义表单生成器并不能解决问题...
    猜你喜欢
    • 2018-07-08
    • 2023-03-19
    • 2023-03-10
    • 2020-11-09
    • 2021-04-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-03-16
    相关资源
    最近更新 更多