I am using ajax function for loading more data it is working in desktop absolutely fine, but when I am hit that particular page on my mobile web browser it will not work. This is my ajax code.
$(document).ready(function(){
$(window).scroll(function(){
var lastID = $('.load-more').attr('lastID');
var isFirstRun=false;
if(($(window).scrollTop() == $(window).height() - $(document).height()) && (lastID != 0)){
$.ajax({
type:'POST',
url:'getdata2.php' ,
data:'id='+lastID,
beforeSend:function(){
$('.load-more').show();
},
success:function(html){
$('.load-more').remove();
$('#postList').append(html);
}
});
}
});
});
I think for mobile this window scroll event is not being recognized. You just put alert into your scroll function to debug. If the alert is not even recognized that means the scroll event not working for mobile.
So, into your code put this code also:
$(document.body).on('touchmove', function(){
var lastID = $('.load-more').attr('lastID');
var isFirstRun=false;
if(($(window).scrollTop() == $(window).height() - $(document).height()) && (lastID != 0)){
$.ajax({
type:'POST',
url:'getdata2.php' ,
data:'id='+lastID,
beforeSend:function(){
$('.load-more').show();
},
success:function(html){
$('.load-more').remove();
$('#postList').append(html);
}
});
}
}); // for mobile