在 Rails 中使用 Simple_Form 通过 Coffeescript 将 Bootstrap Glyphicon 添加到表单输入的右侧答案

【问题标题】：Add Bootstrap Glyphicon to Right Side of Form Input via Coffeescript using Simple_Form in Rails在 Rails 中使用 Simple_Form 通过 Coffeescript 将 Bootstrap Glyphicon 添加到表单输入的右侧
【发布时间】：2015-03-12 22:43:53
【问题描述】：

我正在尝试使用 rails 中的 simple_form 在表单输入的右侧添加一个引导字形图标。

此链接显示了我在这里尝试得到的渲染结果（特别是输入右侧的 glyphicon-remove）：http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_form_horizontal_all&stacked=h

我知道它必须有一个跨度，然后是该跨度内的 glyphicon glyphicon-remove 类。我从这个网站得到了信息：http://www.w3schools.com/bootstrap/bootstrap_glyphicons.asp

我正在尝试在咖啡脚本中执行此操作。到目前为止不起作用的咖啡脚本代码：

$('#serve_dev_sub_email').add("span").addClass("glyphicon glyphicon-remove")

我也尝试过这段代码，但也没有用：

$('#serv_dev_sub_email').add("span")
$('#serv_dev_sub_email').first().addClass("glyphicon glyphicon-remove")

这里是_form 部分：

<%= simple_form_for(@serv_dev_sub) do |f| %>

  <div class="form-inputs">
    <div>
        <%= f.input :email, placeholder: "myemail@domain.com" %>
    </div>

  </div>

  <div class="form-actions">
      <%= f.button :submit %>
  </div>
<% end %>

【问题讨论】：

标签： jquery ruby-on-rails twitter-bootstrap coffeescript

【解决方案1】：

您需要在#input-element 和

$('#input-element span:first-child').addClass("glyphicon glyphicon-remove")

【讨论】：

我试过了，但不幸的是没有用。我将在原始问题中添加我尝试过的其他内容。
你能显示#input-element的代码和它的内部内容吗？
我看不到 ID 为 #input-element的元素
请在您想发布您的 div 的地方添加评论空间
我不太确定你在问什么。我需要做的是向元素 #serv-dev-sub-email 添加一个跨度，以便我可以将 glyphcon 类添加到该跨度。我可以很好地抓住那个元素。它将跨度添加到该元素，然后将类添加到该跨度。这就是问题所在。

【解决方案2】：

这就是我所做的：

<div class="form-inputs">
  <%= f.input :email, :class => 'form-control', :placeholder => 'myemail@domain.com' %>
  <%=link_to '',root_path,:class => 'glyphicon glyphicon-remove clear-email',:onclick => "$('.search-box').val('');"%>
</div>

【讨论】：