原生射流研究…下拉加载插件分享

使用方式：

新的DownUpdata({ URL : ' http://192。168 .1 .103:8080/测试/数据。JSON '，distance:20，callback:function(resp，config){ var OUl=document。getelementbyid(' ul ')；for(var I=0；iresp。数据。长度；我=1){ OUl。innerHTMl=' Li ' resp。数据[一].标题/李；}}}).isBottom()；

默认滚动到底部会去请求创建交互式、快速动态网页应用的网页开发技术

参数说明：

url:请求的数据地址，不支持跨域（必须)

距离：距离底部多远加载（可选参数)

回拨：当滚动到指定距离后请求完创建交互式、快速动态网页应用的网页开发技术将会触发这个回调函数，里面有两个参数，第一个为数据（以及转成JSON对象了，用的是JSON.parse，可能低版本浏览器不支持这个方法),第二个参数为传进去的参数，当你需要重新改变请求信息的时候可以用这个，比如说你想做分页效果，就需要改变全球资源定位器(统一资源定位符)地址。

回拨（名称1、名称2)

名称1:数据

名称2:配置

源代码：

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 ' title document/title meta name=' viewport ' content=' width=device-width，initial-scale=1' style body，ul { margin:0划水：0;} /style/headbody ul id='ul' /ul脚本函数downlupdata(obj){ this。config=obj};下载数据。原型={//判断是否到达底部is bottom : function(){ var _ this=this；var scrollH=null，client height=nullscroltop=null distance=this。配置。距离| | 0；h=0；函数scroll(){ scroll h=文档。尸体。滚动高度| |文档。文档元素。滚动高度；客户端高度=窗口。内部高度；向上滚动=文档。尸体。向上滚动| |文档。文档元素。滚动顶部；h=client height scroltopif(h=scrollH-distance){ _ this。Ajax()；} }滚动();窗户。on scroll=function(){ scroll()；};}, //发送创建交互式、快速动态网页应用的网页开发技术请求Ajax :函数(){ var _ this=thisvar xhr=nullif(窗口. XMLHttpRequest){ xhr=new XMLHttpRequest()；} else { xhr=新ActiveX对象(' Microsoft .XMLHTTP’)；} xhr.open('GET '，this.config.url，true)；xhr。onreadystatechange=function(){ if(xhr。readystate==4xhr。status==200){ _ this。配置。回调(JSON。解析(xhr。responsetext)，_ this。config)；} } xhr。send()；} };新的downlupdata({ URL : ' http://192。168 .1 .10:8080/测试/数据。JSON '，distance:20，callback:function(resp，config){ console。日志(配置)var OUl=文档。getelementbyid(' ul ')；for(var I=0；iresp。数据。长度；我=1){ OUl。innerHTMl=' Li ' resp。数据[一].标题/李；} }}).isBottom()；/脚本/正文/html以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，同时也希望多多支持我们！