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" с классом "more", который вложен в расположение элементов div и fieldset. Видя, как "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
});

Однако ни один из них, похоже, не связывает событие click с классом ".more".

Если кто-нибудь знает, что мне не хватает, помощь будет принята! Спасибо всем,

Answer 1

Решенная проблема оказалась проблемой, когда конвейер ресурсов Ruby on Rails не загружал файл javascript.

Чтобы уточнить, моя первоначальная реализация была правильной.

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

Answer 2

Вы можете использовать как ниже код

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

 or

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

Я думаю это будет работать

Answer 3

Вы можете попробовать это, он будет применять прослушиватель щелчков ко всем "а", имеющим класс больше;

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