如何制作图像在跨度中的按钮

Question

我在 html 中有这个

<form id="contact-form" action="#0" class="ae-form--full">
            <input type="text" placeholder="* Name" required>
            <input type="email" placeholder="* Email" required>
            <textarea placeholder="Message ..." cols="30" rows="4"></textarea>
            <p class="au-xs-ta-right au-pt-4 group-buttons"><a href="#0" class="arrow-button arrow-button--right arrow-button--out">Send<span class="arrow-cont">
                  <svg>
                    <use xlink:href="assets/img/symbols.svg#arrow"></use>
                  </svg></span></a></p>
          </form>

现在我想知道如何使用类制作提交按钮，以及 svg 图像必须放在跨度中的什么位置。

Answer 1

首先你应该使用像form_for这样的rails表单助手 我喜欢用simple_form

你正在寻找的东西应该看起来像这样。

<%= form_for @contact do |f| %>
  <%= f.label :name %>:
  <%= f.text_field :name %><br />

  <%= f.label :email %>:
  <%= f.text_field :email %><br />

  <%= f.label :message %>:
  <%= f.text_area(:message, cols: 20, rows: 40) %><br />
    <%= button_tag(type: 'submit', class: "btn btn-primary") do %>
      Save <span class="icon-ok icon-white"></span> 
    <% end %>
<% end %>

试着让你的 btn 像

<%= button_tag(type: 'submit', class: "btn btn-primary") do %>
  Save <span class="icon-ok icon-white"></span> 
<% end %>

---

Simple_form 示例

<%= simple_form_for @contact do |f| %>
  <%= f.input :name %>
  <%= f.input :email %>
  <%= f.input :message %>
  <span>
    <%= f.button :submit %>
  </span>
<% end %>

我不确定你是否知道在控制器中你应该有：

def new 
  @contact = Contact.new
end 

希望对你有帮助

Answer 2

<button type="submit" class="btn btn-primary" id="get_drug_search_results">
   <span class="textm"><%= t("labels.find_result") %></span>
   <span class="icon "><%=image_tag("magnifying-glass-grey.png", width: 20, height: 20,:id=> "image")%></span>
</button>