JQuery .on() 嵌套点击事件

Question

我有一个非常复杂的表单，它会触发 AJAX 调用来呈现检索特定信息的部分。

我遇到了一个特定场景，我想将 .on('click') 事件绑定到一个行为类似于按钮的元素。问题是，这个元素深深地嵌套在其他元素中，这些元素在部分刷新期间也会被破坏。这是 HTML 的示例。

<div id="locations_grid"><%= render 'table' %>

部分：

<fieldset>
  <legend>List</legend>
  <div class="lists>
    <div class="project_list">
      <div id="pagination_link">
        <a class="more">
            More records
        </a>
      </div>
    </div>
  </div>
</fieldset>

在我的示例中，我想将 'click' 事件绑定到 class "more"，它嵌套在 div 和字段集的排列中。鉴于 "location_grid" 呈现 html，这将是 .on() 事件的定位点，因为它不会在局部刷新后被销毁 - 所以我最初的尝试是：

$('#locations_grid').on('click','.more', function(){
  //do something
});

然而，（据我所知）我怀疑这行不通（事实并非如此），因为“.more”不是“#locations_grid”的直接子代。所以到目前为止，我的尝试是各种组合：

$('#locations_grid').on('click','fieldset .lists .project_list #pagination_link .more', function(){
  //do something
});

但是，none 似乎成功地将点击事件绑定到“.more”class。

如果有人知道我遗漏了什么，欢迎提供帮助！谢谢大家，

Answer 1

你可以像下面的代码一样使用

   $('body').on('click','fieldset .lists .project_list #pagination_link .more', function(){
      //do something
    });

 or

  $('body').on('click','.more', function(){
      //do something
    });

我认为它会起作用

Answer 2

你可以试试这个，它会在所有 'a' 上应用点击侦听器 class；

    $('div').has(".more").on('click','.more', function(){
     //do something;
    });

Answer 3

已解决-问题原来是 Rails 资产管道上的 Ruby 没有加载 javascript 文件的问题。

澄清一下，我最初的实施是正确的。

$('#locations_grid').on('click','.more', function(){
  //do something
});

JQuery .on() 嵌套点击事件

JQuery .on() Nested Click Event

jquery

ruby-on-rails

click

event-binding