Question

我添加了一个脚本来触发输入事件，它可以正常工作，直到我们滚动页面。当我们滚动时，动态地添加另一个页面（它是ajax调用），但是从第二页脚本中没有加载。

这是代码：

<%= form_tag add_comments_statuses_path, :data => {:toggle => "validator"}, :html => {:class=>"form-horizontal row-fluid shift_from", :id => "comments_form_#{status}"}, method: :post, :remote => true  do %>
  <div class="control-group">
    <a href="#" class="cmt-thumb">
        <%= image_tag current_user.profile_pic, :style=>"width:40px!important; height:40px;" %>
    </a>
    <div class="controls cmt-form " style="margin-bottom:10px;">
      <%= text_area_tag  'comment', " ", :class => "form-control", :id => "comment-form-#{status}", :placeholder =>"Write a comment...",:data => {:error => "Please Enter Comment"}, required: true %>
      <span class="help-block with-errors" id = "error-#{status}"></span>

    </div>
  </div>
  <input type="hidden" value="<%= status %>" name="status_id">
<% end %>


<script>
  $(function(){
    $("#comment-form-<%= status %>").keypress(function(event) {
       if (event.which == 13) {
          event.preventDefault();
          if ($(this).val() != " ")
           $(this).closest('form').submit();
       }
    });
  })
</script>

Answer 1

滚动之后和第二页中没有工作，因为新页面无法识别按键事件，因为初始DOM中不存在新添加的html。

要解决此问题，您必须编写 keypress event inline 并从中调用函数，如下所示：

<input type='text' onkeypress = "return yourFunction(event)"/>

注意：请检查onkeypress事件调用语法一次

页面滚动后Javascript未加载

1 个答案: