在Rails中用glyphicon替换提交按钮

Question

快速提问。我有:

<%= f.submit "Like", class: "btn btn-large btn-primary" %>

我希望将整个按钮替换为以下内容，而不是显示“like”文本：

<span class="glyphicon glyphicon-thumb-up"></span>

符号。

在Rails中，用拇指向上的图标替换提交按钮并保持相同功能的正确方法是什么？

更新：

我找到了这个：

<%= button_tag(type: 'submit', class: "btn btn-primary") do %>
  <span class="glyphicon glyphicon-thumbs-up"></span> 
<% end %>

但唯一的问题是，即使我删除btn btn-primary，这仍然显示在glyphicon按钮的后面。有谁知道如何去掉按钮呢？

谢谢！

- MikeHolford

---

看一下这个：https://dev59.com/Q2gu5IYBdhLWcg3wEzHP - sissy

谢谢你。问题已更新 :) - MikeHolford

我自己花了一段时间寻找这个问题的答案。最终只能在没有表单助手的情况下硬编码它。希望你能有更好的运气。 - toolz

谢谢@toolz，我会试一下。 - MikeHolford

按钮的外观来自于你的CSS类“btn btn-primary”。不过，你并不需要它们来让它像一个按钮一样运作... - Cyril Duchon-Doris

Answer 1

我发现这个方法可以使用一个只包含glyphicon的按钮来提交表单： <%= button_tag "", type: 'submit', class: "btn btn-default glyphicon glyphicon-ok pull-right" %> glyphicon类是复选框而不是点赞，bootstrap按钮样式为默认值而不是主要值，但它应该能够完成相同的操作。

- Ian MacDonald

Answer 2

您可以将以下类添加到按钮中以隐藏按钮背景：

    .like-page{
      background: none;
      border: none;
    }

- C LOKESH REDDY

Answer 3

抱歉，我一开始没有理解清楚。

为了避免按钮，您实际上有几种方法：

• 将一些CSS应用于您的按钮，使其变成透明的，只留下图标可见：

  background: transparent; border: none; padding: 0;

• 使用jQuery（或类似工具）提交替代Rails提交。例如：

  <span class="glyphicon"></span>

  $('span.glyphicon').click(function(){ $('#my_form').submit()});

在Rails 3之前，可以使用link_to_function或link_to_remote助手调用js函数，但自从Rails 4以后就不再可能了。 还可以看看这里Rails 3 submit form with link和这里Rails, how do you submit a form with a text link?

希望这可以帮到您。

- sissy

---

非常感谢！实际上我已经决定用另一种方式来解决问题，但如果我想回头再试这个方法的话，这个答案很棒。我会接受这个答案供其他人参考 :) - MikeHolford