Html 如何使用Twitter引导&x27；带轨道的字形图标'；s按钮到

我有几个按钮可以提交AJAX请求

<%= button_to 'GO!', {controller:'videos', action:'rate', id: video.hashed_id, format: 'json'}, {:remote=>true, :class=>"btn btn-default btn-sm"} %>

这是由谁创造的：

<form action="/videos/rate/asdfsxsdf/no.json" class="button_to" data-remote="true" method="post">
<div><input class="btn btn-default btn-sm" type="submit" value="<i class="icon-thumbs-up"></i>" />
<input name="authenticity_token" type="hidden" value="es4wPqFr9xPBUFsbHQR/gAzofDC+ZwYsiiJ7RAQZUHk=" />
</div></form>

试试这个：

---

true，：class=>“btn btn默认btn sm”}%>

这不是超级性感，但很管用

<%= form_tag({controller:'videos', action:'rate', id: video.hashed_id, yesno:'no', format: 'json'}, {remote:true} ) do %>
<%= button_tag '', :class=>"rate-btn yes-btn btn btn-default btn-lg glyphicon glyphicon-thumbs-down" %>
<% end %>

“速率btn是btn btn btn默认btn lg字形图标字形图标拇指朝下”%>

---

基本上（如上面的评论所述），问题是glyphicon使用的语法不能用于像

这样的自动关闭元素，因此需要一个按钮。不幸的是，Rails的

按钮\u to

也会在表单内部生成

。您可以用手写的方式编写表单，但是Rails内置的防伪系统会出现问题（您需要一个真实性令牌）。因此，我将

表单标签

和

按钮标签

与相应的类相结合，我们就可以开始了。

我认为.html\u safe可以解决您的问题。我会尝试替换“开始！”与：

'<span class="glyphicon glyphicon-thumbs-up"></span>'.html_safe

“”.html\u安全

或者如果你还想发短信

'<span class="glyphicon glyphicon-thumbs-up"></span> GO!'.html_safe

“开始！”。html_安全

使用bootstrap3 根据的Bootstrap 3文档，可以使用以下HTML实现左侧带有星形图标、右侧带有文本星形的大按钮：

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-star"></span> Star
</button>

<a class="btn btn-large" href="#"><i class="icon-star"></i> Star</a>

明星

使用Rails中的button_标记，您可以这样创建相同的按钮：

<%= button_tag '<span class="glyphicon glyphicon-star"></span> Star'.html_safe , :class=>"btn btn-default btn-lg" %>

“btn btn默认btn lg”%>

类似地，如果您希望在文本后添加图标，则如下所示：

<%= button_tag 'Star <span class="glyphicon glyphicon-star"></span>'.html_safe , :class=>"btn btn-default btn-lg" %>

“btn btn默认btn lg”%>

NB:不要忘记关闭范围标记和按钮文本之间的空格

使用引导程序2 根据的Bootstrap 2文档，可以使用以下HTML实现文本右侧带有星形的大星形按钮：

<button type="button" class="btn btn-default btn-lg">
  <span class="glyphicon glyphicon-star"></span> Star
</button>

<a class="btn btn-large" href="#"><i class="icon-star"></i> Star</a>

使用Rails中的button_标记，您可以使用以下方法创建相同的按钮：

<%= button_tag '<i class="icon-star"></i> Star'.html_safe , :class=>"btn btn-large" %>

“btn btn大”%>

使用Rails 3/4和引导程序，该功能可以：

              <%= button_to "/hubspot/new_campaign?id=tab1-2", :class=>"btn btn-default btn-icon glyphicons
              message_plus", :remote => true do %>
                  <i></i>Create New Campaign
              <% end %>

btn btn默认btn图标图标图标 消息加“，：remote=>true do%> 创建新活动

---

我想要更全面一点的。。。一个按钮，上面有文字和符号。我把上面的答案混在一起，但这有点不同。用一个跨度标签包装这些部件就达到了目的：

在哈姆

 = button_to(rails_path(:id => id), :remote => true, class: 'btn btn-
     success) do
   %span
     %span.glyphicon.glyphicon-star
     Star!

经过一些插值后，生成（在rails 5中）

明星

您的代码正在抛出错误，我在任何地方都找不到该函数的文档。您可以确认它是否有效，或者指导我找到它的文档。我让它正常工作，但它仍然会导致标记被注入到

value='

属性中。我在上面添加了结果。要使用GlyphIcon，您需要使用标记。Ruby

按钮_to

助手呈现

。如果不覆盖

按钮的功能，则无法执行此操作。如果您不需要表单和提交，您可以使用
按钮\u标记
助手。这在rails 4中对我有用。我认为这是最好的解决办法。谢谢@Prakash