单击事件不会从第二页开始触发

Question

我对单击事件有一个问题。我使用的是jPList插件，我对每个结果集都有一个单击函数。第一页单击函数工作正常，但当我选择第二页或第三页并单击按钮时，它不会被触发。

HTML

<!-- demo -->
<div id="demo">

<!-- panel -->
<div class="jplist-panel">

<!-- pagination control -->
<div class="jplist-pagination" data-control-type="pagination" data-control-name="paging" data-control-action="paging" data-items-per-page="2">
</div>

</div>

<!-- HTML data -->
<div class="list">

<!-- item 1 -->
<div class="list-item">
  <p>
    first result
  </p>
  <p class="hitme">
    click me
  </p>
  <hr>
</div>

<!-- item 2 -->
<div class="list-item">
  <p>
    second result
  </p>
  <hr>
</div>

<!-- item 3 -->
<div class="list-item">
  <p>
    thrid result
  </p>
  <button class="hitme">
    click me
  </button>
  <hr>
</div>

<!-- item 4 -->
<div class="list-item">
  <p>
    fourth result
  </p>
  <hr>
 </div>
 <hr>

 <!-- item 5 -->
 <div class="list-item">
  <p>
    fifth result
  </p>
  <button class="hitme">
    click me
  </button>
  <hr>

 </div>

 <!-- item 6 -->
 <div class="list-item">
  <p>
    sixth result
  </p>
   </div>
 </div>
 </div>

jQuery

$('document').ready(function() {

$('#demo').jplist({
itemsBox: '.list',
itemPath: '.list-item',
panelPath: '.jplist-panel'
});

$('.hitme').on('click', function() {
 alert('clicked');
})

});

有人能帮我一下吗。

见JSfiddle

Answer 1

由于尚未生成元素，所以click事件不绑定。从已经加载的某个元素委托事件，我将“单击”事件更改为如下所示：

$(document).on('click', '.hitme' , function() {
    alert('clicked');
  })

演示

干杯,

阿肖克

Answer 2

试试这段代码

$('document').ready(function() {
      $('#demo').jplist({
         itemsBox: '.list',
         itemPath: '.list-item',
         panelPath: '.jplist-panel'
      });
      $("body").on('click', '.hitme', function(){
         alert('clicked');
      });
   });