28

我正在尝试创建按钮 ala Wufoo (重新发现按钮元素

我想编写以下代码,如下所示:

<%form_tag search_path, :method => :get, :class => 'search' do %>
  <%=text_field_tag :search, params[:search] -%>
  <%=button_tag 'search', :name => nil-%>
<%end%>

生成以下 HTML(而不是 input[type="submit"] 标签)

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt=""/> 
    Save
</button>

方法是否已经存在?还是我应该推出自己的帮手?

4

3 回答 3

37

您可以使用 content_tag 来实现这一点。这是做你想做的事的更有条理的方式。但它比原始 HTML 更长。

<% content_tag :button :type => :submit, :class => :positive do %>
   <%= image_tag "icons/tick.png"%>
   Save
<% end %>

哪个生产

<button type="submit" class="positive">
    <img src="/images/icons/tick.png" alt="Tick"/> 
    Save
</button>

但是,以此为起点,您应该可以毫无问题地滚动您自己的强大助手,或将其抽象为部分。

于 2010-02-12T20:53:30.660 回答
2

您可以使用image_submit_tag帮助器来创建图像提交标签,而不是将整个内容包装在一个按钮中:

<%
image_submit_tag("login.png")
# => <input src="/images/login.png" type="image" />

image_submit_tag("purchase.png", :disabled => true)
# => <input disabled="disabled" src="/images/purchase.png" type="image" />

image_submit_tag("search.png", :class => 'search-button')
# => <input class="search-button" src="/images/search.png" type="image" />
%>

如果您需要“保存”文本出现在<img>

于 2010-02-12T20:15:26.687 回答
0

使用 JQuery Cheats Gem https://github.com/plowdawg/jquery_cheats在您看来它只是

<%= submitimage("/path/to/image.png","Alternate Text") %>

注意:替代文本是可选的。

于 2011-08-17T21:10:14.560 回答