连续滚动时更新网页内容

时间:2018-08-20 19:33:11

标签: javascript html

我想问一下我如何实现Facebook或Quora之类的功能,以便我不断滚动页面,并且内容无需刷新就可以自动更新

2 个答案:

答案 0 :(得分:0)

最好的方法是简单地检查何时到达页面check this answer的底部。您可能要在其上放置一个偏移量,以便在到达底部之前加载新内容。

到达触发器后,您将进行AJAX调用(这取决于您使用的是哪种Framework / vanillaJS),然后只需获取新内容并将其附加到页面底部即可。希望这会有所帮助!

答案 1 :(得分:0)

当用户滚动到页面底部时,您可以执行AJAX调用以更新页面内容。

window.addEventListener("scroll", function(e){
    if ((window.innerHeight + window.pageYOffset) >= document.body.offsetHeight) {
        //bottom of the page reached
      var xhttp = new XMLHttpRequest();
      xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
         document.getElementById("content").innerHTML += this.responseText;
        }
      };
      xhttp.open("GET", "someurl", true);
      xhttp.send();
    }
});