Контент добавлен дважды, но только один раз зациклен

Я хочу добавить больше контента в свой канал, используя AJAX, и он добавляет контент, но добавляет его дважды. Чтобы исключить такие причины, как запрос AJAX, отправляемый два раза, я добавил целое число i, Но i только равен 1 (как указано моим h1 элемент), если я прокручиваю вниз.

AJAX success Функция получает объект 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);

3 ответа

Решение

Я бы попробовал что-то подобное. Мое чувство подсказывает мне, что он "захватывает" пиксель и стреляет не раз. Вы можете скачать плагин debounce / throttle и использовать его и установить его равным 250, или попробовать этот "единожды метод"

при использовании debounce (необходимо загрузить плагин)

Я перечитал ваш пост (после того, как вы обновили), и вы связываетесь дважды: один раз так:

$(window).scroll(bindScroll);

и снова вот так:

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

Я чувствую, что это красный флаг здесь. после перечитывания я, вероятно, либо просто скачаю плагин, либо заверну его в debounce ($(window).scroll(bindScroll);).


$.debounce( 250, bindScroll ) 

вместо этого:

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

попробуй это:

$( window ).one( "scroll", function() {
     bindScroll()
});

Попробуй переехать i++ ниже, как это

success: function(datanew) {
        $("h1").text(i);
        var datarec = datanew.replace(/},]$/,"}]");
        //alert(datarec);
        var string  = json2html.transform(datarec,template);
        $(string).insertAfter($('.parent').last());
        i++;
    }

Вместо:

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

Использование:

$('.parent').append($(string))
Другие вопросы по тегам