2

我想使用 AJAX 向我的提要添加更多内容,它确实添加了内容 - 但它添加了两次。为了排除诸如 AJAX 请求被提交两次之类的原因,我添加了 integer i。但如果我向下滚动,则i仅等于 1(如我的元素所述)。h1

AJAXsuccess函数接收一个 json 对象(我可以在警报中看到),然后将其转换为 html 两次(相同的对象和相应的 html)。你知道为什么会出现这个问题吗?

jQuery:

function loadMore()
{
    var i = 0;
    var accountpar = $(".parent").length;

    $.ajax({
        url: 'homemore.php',
        type: 'post',
        data: {
            'account':accountpar
        },
        success: function(datanew) {
            i++;
            var datarec = datanew.replace(/},]$/,"}]");
            var string  = json2html.transform(datarec,template);
            alert(string);
            $(string).insertAfter($('.parent').last());
        }
    });
    $(window).bind('scroll', bindScroll);
}

function bindScroll(){
    if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
        $(window).unbind('scroll');
        loadMore();
    }
}

$(window).scroll(bindScroll);
4

3 回答 3

1

我会尝试这样的事情。我的感觉告诉我,它“按像素”捕获并多次发射。您可以下载 debounce/throttle 插件并使用它,并将其设置为 250,或尝试这种“一次方法”

如果使用 debounce(必须下载插件)

我重新阅读了您的帖子(在您更新后),并且您绑定了两次:一次是这样的:

$(window).scroll(bindScroll);

又像这样:

$(window).bind('scroll', bindScroll);

我觉得这是一个危险信号。重新阅读后,我可能只是下载插件并将其包装在去抖($(window).scroll(bindScroll);)中。


$.debounce( 250, bindScroll ) 

而不是这个:

 $(window).bind('scroll', bindScroll);

试试这个:

$( window ).one( "scroll", function() {
     bindScroll()
});
于 2016-04-02T07:27:26.783 回答
0

尝试i++像这样移动到下方

success: function(datanew) {
        $("h1").text(i);
        var datarec = datanew.replace(/},]$/,"}]");
        //alert(datarec);
        var string  = json2html.transform(datarec,template);
        $(string).insertAfter($('.parent').last());
        i++;
    }
于 2016-04-02T06:56:07.857 回答
-1

代替:

$(string).insertAfter($('.parent').last())

采用:

$('.parent').append($(string))
于 2016-04-02T07:03:59.773 回答