如何将图标放入rails提交按钮

Question

我正在使用Bootstrap,并希望在表单的提交按钮中添加一个图标.
这是代码:

<%= f.submit "Submit for Approval <i class='icon-share-alt icon-white'></i>", 
                                class: "button_green" %>

生成的HTML:

<input type="submit" value="Submit for Approval &lt;i class='icon-share-alt icon-white'&gt;&lt;/i&gt;" name="commit" class="button_green">

我尝试将raw和html_safe添加到文本中,但似乎都没有.
我知道一个解决方案就是让类成为带有图标的图像,但我想这样做而不创建额外的图像/ CSS.有什么建议？

Answer 1

您可以使用button_tag代替:

<%= button_tag( :class => "button_green") do %>
  Submit for Approval <i class="icon-share-alt icon-white"></i>
<% end %>

这将创建一个<button type="submit"></button>内部带有图标和字幕的元素.我已经测试过它的确有效.button_tag要提交的默认操作是,因此如果您需要其他操作(例如取消),则可以使用该:type => "button"选项覆盖默认提交行为.

编辑:对于Bootstrap 3,图标类名已更改,因此您可以放置

<span class="glyphicon-white glyphicon-share-alt white"></span>

请注意,白色图标不再是特殊类.刚做一个css课.white并放color: #fff;.简单.您可以使用任何颜色或文本样式,因为图标现在是一种字体.