Javascript 第一次追加重复

Javascript 第一次追加重复,javascript,jquery,ajax,wordpress,append,Javascript,Jquery,Ajax,Wordpress,Append,我面临两个问题,如果有人能帮助我,那就太好了 第一次尝试单击“加载更多”按钮时添加重复的日志,但第二次单击时效果良好。 在快速点击或双击时,它会一次又一次地复制同一篇文章。 //AJAX加载更多博客文章 函数AJAXLoadMorePosts{ $。加载更多帖子。单击函数E{ e、 防止违约; //变数 var元素=$this; var target=element.attr'href'; var post_wrapper=$'。blog posts wrapper'; //运行AJAX $.a

我面临两个问题,如果有人能帮助我,那就太好了

第一次尝试单击“加载更多”按钮时添加重复的日志,但第二次单击时效果良好。 在快速点击或双击时,它会一次又一次地复制同一篇文章。 //AJAX加载更多博客文章 函数AJAXLoadMorePosts{ $。加载更多帖子。单击函数E{ e、 防止违约; //变数 var元素=$this; var target=element.attr'href'; var post_wrapper=$'。blog posts wrapper'; //运行AJAX $.ajax{ 键入:“GET”, url:target, 成功:functiondata、textStatus、XMLHttpRequest{ //存储新数据 var new_post_items=$data.find'.blog posts wrapper.blog post'; var next_page_url=$data.find'.nav previous a'.attr'href'; //更新加载更多按钮Href 如果下一页\u url{ 元素attr'href',下一页\u url; }否则{ 元素slideUp; } post_wrapper.appendnew_post_项目; }, 完成:功能{ element.htmloadingtextorg; }, 错误:functionMLHttpRequest、textStatus、ErrorRown{ 警报错误抛出; } }; }; } 如前所述,AJAXLoadMorePosts附加了$'.load more posts'单击处理程序,其结果有两个:

在第一次调用AJAXLoadMorePosts之前,不会附加任何单击处理程序。 在随后的调用中,AJAXLoadMorePosts将附加越来越多的单击处理程序,这是完全不受欢迎的。 解决方案是将click处理程序一次附加到所有相关元素,或者委托给包装元素

您还需要确保click处理程序执行测试,以便它仅在ajax请求尚未进行时才执行ajax

像这样的东西应该可以

// AJAX Load More Blog Posts
$('.load-more-posts').text(loadingTextOrg).on('click', function(e) {
    e.preventDefault();
    var $element = $(this);
    if($element.text() == loadingTextOrg) {
        var $element = $(this).text(somethngElse);
        $.get($element.attr('href')).then(function(data, textStatus, XMLHttpRequest) {
            var next_page_url = $(data).find('.nav-previous a').attr('href');
            if (next_page_url) {
                $element.attr('href', next_page_url);
            } else {
                $element.slideUp();
            }
            $('.blog-posts-wrapper').append($(data).find('.blog-posts-wrapper .blog-post'));
        }, function(MLHttpRequest, textStatus, errorThrown) {
            alert(errorThrown);
        }).always(function() {
            $element.text(loadingTextOrg);
        });
    }
});

关于第一点,你是对的。我更改了var$element=$this;to var元素=$'。nav前一个a';它工作得很好。现在的问题是,我应该如何检查它的最后一篇文章它是否一次又一次地重复最后一篇文章,因为$element总是显示最后一篇文章,也许我没有抓住重复的要点。你的意思是服务器会一次又一次地返回相同的帖子吗?