javascript - 委托(delegate)函数在 jquery 2.1.1 中不起作用

Question

我有这段代码用于在 comment-list div 中加载内容，使用 jQuery delegate 进行分页:

JS :

<script type="text/javascript">
    $('#comment-list .pagination a').delegate('click', function() {
        $('#comment-list').fadeOut('slow');

        $('#comment-list').load(this.href);

        $('#comment-list').fadeIn('slow');

        return false;
    });         

    $('#comment-list').load('index.php?route=simple_blog/article/comment&simple_blog_article_id=<?php echo $simple_blog_article_id; ?>');

</script>

HTML :

<div id="comment-list"> 
  <div class="pagination">
    <div class="links">
     <b>1</b> 
       <a href="http://localhost/oc/index.php?route=simple_blog/article/comment&amp;simple_blog_article_id=5&amp;page=2">2</a> 
       <a href="http://localhost/oc/index.php?route=simple_blog/article/comment&amp;simple_blog_article_id=5&amp;page=3">3</a>
       <a href="http://localhost/oc/index.php?route=simple_blog/article/comment&amp;simple_blog_article_id=5&amp;page=2">&gt;</a>
       <a href="http://localhost/oc/index.php?route=simple_blog/article/comment&amp;simple_blog_article_id=5&amp;page=3">&gt;|</a> </div><div class="results">Showing 1 to 5 of 11 (3 Pages)
   </div>
  </div>
</div>

但在实际操作中，我的代码无法正常工作，无法在 div 中加载内容。单击分页链接后，我会看到打开的新窗口并加载我的内容。我在 jQuery 2.1.1 版本中测试了我的代码，我认为 delegate 在 jQuery 2.1.1 中不起作用。

如何解决我的问题？

Answer 1

As of jQuery 3.0, .delegate() has been deprecated. It was superseded by the .on() method since jQuery 1.7, so its use was already discouraged.

For earlier versions, however, it remains the most effective means to use event delegation. More information on event binding and delegation is in the on() method.

使用事件委托(delegate) on() 而不是:

$('body').on('click', '#comment-list .pagination a', function() {
    ....
});  

希望这对您有所帮助。