Question

我正在使用simple_form作为我的表单，并希望在文本字段上启用一些基本的JS字符计数。

我的表单部分看起来像这样：

<%= simple_form_for(@post, html: {class: 'form-horizontal' }) do |f| %> 

    <%= f.error_notification %>

    <%= f.input_field :parent_id, as: :hidden %>

    <div class="field">
    <% if can? :manage, @post %>
            <%= f.input_field :status, label: "Status", collection: Post.statuses.keys, selected: :unconfirmed %>   
    <% end %>       
    </div>

    <%= f.input :title, placeholder: "Enter Title" %>
    <%= f.input :photo %>
        <%= f.input :file %>
    <%= f.input :body %>
        <div class="report-submit">
            <%= f.button :submit %>
        </div>

<% end %>

我该怎么做？

Answer 1

将id分配到文本字段，然后在其旁边添加span，以显示计数器，并为该范围指定id。

<%= f.input :body, id: "body-field" %>
<span id="body-count">0 characters</span>

在Javascript中添加此代码

$("#body-field").on("keyup", function(){
    length = $(this).val().length;
    $("#body-count").html(length);
});

我创建了一个小提琴来展示它是如何工作的，点击这里http://jsfiddle.net/L99c30qh/

如何在simple_form中实现基本字符计数器？

1 个答案: