0

现在我的计数器显然总是从 350 开始。我希望它使用正确的数字，但我不确定如何在 ruby​​ 语法中调用“左”js var。

<%= form_for [@status], :url => user_status_path(current_user) do |f| %>
  <%= render 'shared/error_messages', object: f.object %>
  <div class="field">
    <%= f.text_area :content, id:"status_box", maxlength:350, placeholder: "Status?" %>
  </div>
  <%= f.submit "Update", id:"status_btn", class: "btn btn-small btn-primary" %>

  <span id="counter">Characters left: 350</span>

  <script type="text/javascript">
    $('#status_box').keyup(function () {
        var left = 350 - $(this).val().length;
        if (left < 0) {
            left = 0;
        }
        $('#counter').text('Characters left: ' + left);
    });
  </script>
<% end %>

另外，当人们按住键时，我该怎么做才能使计数器发生变化？

4

2 回答 2

1

您可以在页面加载时触发 javascript，以便计算此时剩余的字符：

  <span id="counter">Characters left: 350</span>

  <script type="text/javascript">
    $('#status_box').keyup(function () {
        calculateCharactersLeft();
    });
    $(document).ready(function () {
        calculateCharactersLeft();
    });
    var calculateCharactersLeft = function(){
        var left = 350 - $("#status_box").val().length;
        if (left < 0) {
            left = 0;
        }
        $('#counter').text('Characters left: ' + left);
    }
  </script>

我个人更喜欢这样做，而不是向 erb 中注入东西，但选择权在你。

实际上，如果您从 textarea 属性中提取最大长度，而不是在 JavaScript 中对其进行硬编码，那么您只会在一个地方拥有最大长度值，从而使您的代码保持良好和干燥。

于 2013-01-30T01:49:16.567 回答
1

您需要像这样动态更改 ERB 中剩余的字符数：

<span id="counter">Characters left: <%= 350 - @status.content.length %></span>

要在有人按住键时触发它，请尝试绑定到keypress事件而不是keyup事件。

于 2013-01-30T01:44:44.467 回答