这个实例比较简单,用js或jQuery的方法处理都是可以的。本文使用原生的js来举例。同时解决了在微信/苹果safari浏览器里触发多次请求的bug。下拉加载的原理,是为window添加一个scroll事件,浏览器每次触发scroll事件时判断是否滚动到了浏览器底部,如果到了底部则加载新数据。关键是计算滚动条是否滚动到了浏览器底部,算法如下:滚动条卷起来的高度 + 窗口高度 > 文档的总高度 + 50这里将滚动响应区域高度取50px,也可以根据实际需求调整为其他大小如果这个判断为true则表示滚动条滚动到了底部。实例如下: <style type="text/css">
html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, p, blockquote, th, td{
margin: 0;
padding:0;
}
*{
-webkit-box-sizing:
猿代码
· 2022-05-23
· 214 人浏览
肥牛