检查用户是否已到达页面底部

我试图在用户向下滚动并到达页面底部时触发事件。检查用户是否已到达页面底部

我搜索了互联网，发现了一些帖子在stackoverflow但意外的答案没有为我工作。

例：Check if a user has scrolled to the bottom

使用上述SO后给出的答案，到达页面的顶部而不是底部时，执行我试图触发事件。

请让我知道，如果我错了：

$(window).scroll(function() { 
if($(window).scrollTop() + $(window).height() == $(document).height()) { 
    loadmore(); 
} 
}); 

function loadmore(){ 

var lastProd = $('.product_div').last(); 
var lastProdID = $('.product_div').last().prop('id'); 
//console.info(lastProdID); return false; 
//var val = document.getElementById("row_no").value; 
$.ajax({ 
    type: 'post', 
    url: 'includes/load_products.php', 
    data: { getresult:lastProdID }, 
    success: function (response) { 
     console.log(response); 
     //var content = document.getElementById("all_rows"); 
     //content.innerHTML = content.innerHTML+response; 
     lastProd.after(response); 

     // We increase the value by 10 because we limit the results by 10 
     // document.getElementById("row_no").value = Number(val)+10; 
    } 
}); 
}

来源

2017-08-24 goseo

是否有在控制台中的任何错误？如果没有可重复的东西，这将很难帮助你。 – Script47

你可以用你现在的代码创建一个JSFiddle吗？ –

好的，我会创建一个jsfiddle – goseo

使用window.innerHeight + window.scrollY来确定底部位置，并检查是否document.body.offsetHeight较低（等于将无法正常工作）。

积分为mVChr,see here。

window.onscroll = function(ev) { 
 
    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) { 
 
    alert("bottom of the page reached"); 
 
    } 
 
};

.jump { 
 
    height: 1000px; 
 
}

<div class="jump"></div>

来源

2017-08-24 10:42:03 Ivan

*信用转到[mVChr]（https://stackoverflow.com/users/246616/mvchr），[见这里]（https://stackoverflow.com/a/ 9439807/6331369）* - 然后标记/标记为重复，以便他们真正获得信用。 – Script47

检查高度和偏移量是相等的

window.onscroll = function() { 
    var d = document.documentElement; 
    var offset = d.scrollTop + window.innerHeight; 
    var height = d.offsetHeight; 

    console.log('offset = ' + offset); 
    console.log('height = ' + height); 

    if (offset === height) { 
    console.log('At the bottom'); 
    loadmore(); // call function here 
    } 
};

来源

2017-08-24 10:45:57 ashik

检查用户是否已到达页面底部

回答

相关问题