Delegate function not work in jquery 2.1.1

Question

I have This code for load content in comment-list div for pagination using 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>

But In action My code not work and not load content in div. after click in pagination link, I see open new window and load my content. I test my code in jQuery 2.1.1 Version and I think delegate not work in jQuery 2.1.1.

How do fix my problem?

Change `$('#comment-list .pagination a').delegate('click', function() {` to `$('#comment-list').find('.pagination').delegate(' a', 'click', function() {`, since `delegate` has been discouraged, you should use `.on` — DavidDomain, Oct 25 '16 at 08:43
You should use `.on()`. However, your syntax is not correct, use `$('#comment-list .pagination').delegate('a', 'click', function() {` — Satpal, Oct 25 '16 at 08:43

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

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.

Use event delegation on() instead :

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

Hope this helps.

Delegate function not work in jquery 2.1.1

1 Answers1