Функция AJAX не работает при прокрутке

Question

Функция AJAX не работает при прокрутке

Как будто вы пытаетесь получить доступ к объекту, который является null. Рассмотрим ниже пример:

TypeA objA;

. В это время вы только что объявили этот объект, но не инициализировали или не инициализировали. И всякий раз, когда вы пытаетесь получить доступ к каким-либо свойствам или методам в нем, он будет генерировать NullPointerException, что имеет смысл.

См. Также этот пример:

String a = null;
System.out.println(a.toString()); // NullPointerException will be thrown

25

pdo ajax jquery php javascript

задан ptCoder 5 May 2015 в 16:34

4 ответа

Другие вопросы по тегам:

pdo ajax jquery php javascript

Похожие вопросы:

score 13 · Answer 1

Поскольку вы заменяете содержимое $ ('# posts'), высота документа не изменяется после первого запроса ajax по scroll =>, поэтому вам нужно прокрутить вверх, а затем снова прокрутить вниз, чтобы вызвать другой запрос ajax. Поскольку я не знаю ожидаемого макета страницы, я дам простую базовую демонстрацию HTML JSFiddle demo

<div id="main" style="height:200px; overflow-y : auto;">
    <div id="posts">
    </div>
</div>

javascript

var loadmoore = true,
    loaded_posts =0 ;
function gent_sample_data(num_posts){
    var i,
        sample_data = '';
    for(i=0;i<num_posts;i++) {
        sample_data += "<p class'post'>title_select_query_result " + (loaded_posts + i) + "</p>"; 
    }
    return sample_data;
}

function loadFeed(){
     // generate sample data
    var sample_data = gent_sample_data(15);
    loaded_posts = loaded_posts + 15;
    $.ajax({
        url : '/echo/html/',
        dataType: 'html',
        type: 'post',
        data: {'html':sample_data},
        success: function(returnhtml){
            console.log(returnhtml);
             // option 1 - add result into "havanaglia" div
            // var $post = $('<div class="havanagila"></div>');
            // $post.html(returnhtml);
            // $("#posts").append($post);

            // option 2 - ad result after "havanaglia" div
            $("#posts").append('<div class="havanagila"></div>');
            $("#posts").append(returnhtml); 
            loadmoore = true;
        }    
    });
}
loadFeed();

$("#main").scroll(function () { 
    if (loadmoore && $("main").scrollTop() >= ($("main").height()-100) ) {
       loadmoore = false;
       loadFeed();
    }
});

Для вашего случая я предлагаю использовать что-то вроде этого:

var loadmoore= true;
function loadFeed() {
    $.ajax({
        url: 'loadmore.php',
        dataType: 'html',
        success: function (data) {
            var $havanaglia = $('<div class="havanagila"></div>');
            $havanaglia.html(data);
            $("#posts").append($havanaglia);
            loadmoore = true;
        }
    });
}

loadFeed();

$(window).scroll(function () { 
    if (loadmoore && $(window).scrollTop() >= $(document).height() - $(window).height()-100) {
        loadmoore= false;
       loadFeed();
    }
});

Чтобы предотвратить получение тех же сообщений из базы данных, я рекомендую отправить на php идентификатор / номер последней загрузки сообщение, чтобы получить сообщения с идентификатором / номером> последнее загруженное сообщение

score 6 · Answer 2

измените функцию loadFeed() на эту

function loadFeed() {
    $.ajax({
        url: 'loadmore.php',
        dataType: 'html',
        success: function (data) {
            $("#posts").append('<div class="havanagila"></div>');
            $('#posts').html($('#posts').html()+data);
        }
    });
}

, это изменение, которое вам нужно сделать $('#posts').html($('#posts').html()+data);

score 2 · Answer 3

Похоже, что вы переписали внутреннее содержимое элемента #posts с помощью функции html(). $("#posts").append('<div class="havanagila"></div>'); $('#posts').html(data);

Я думаю, что вы хотите $("#posts").append($('<div class="havanagila"></div>').html(data));

А что касается вашего оператора IF if ((windowScroll + windowHeight) == documentHeight), ваша функция ajax вызывается, только если вы прокручиваете сверху вниз страницы ( на Chrome).

score 0 · Answer 4

Все выглядит хорошо для меня,

Просто измените $(window).scroll(function () {...... на

$(document).on( 'scroll','window', function(){
              //or $(document).on( 'scroll','id of div containing scroll',
   var windowScroll = $(window).scrollTop();
   var windowHeight = $(window).height();
   var documentHeight = $(document).height();

    if ((windowScroll + windowHeight) == documentHeight) {
         loadFeed();
       }
});