ajax无限加载数据

2019-06-22 19:34:15 阅读:2134

效果图如下(pc站也是可以用的):第一步:页面首先要先读取五条数据,这样不至于页面一打开是空的:$list=M('tableName')->limit(5)->select();第二步:写一个ajax页面或者方法,用来承载无限加载的数据(以下使用tp,并且每次加载5条的方法,你也可以改一下):publicfunctionajaxmore(){ $page=$_POST['page'];/*当前是第几页*/ $page_num=5;/*每次读取5条*/ $limit_first=($page-1)*$page_num; $limit_end=$page_num; $list=M('tableName')->limit($limit_first,$limit_end)->select(); if(!empty($list)){ $ary=$list; }else{ $ary=[]; } echojson_encode($ary); }第三步,页面引入jquery和iscroll.js,并且引入css来定位div,不然div乱跑咋办(这两个文件我会在文章末尾放百度云下载链接): #wrapper{ width:100%; position:absolute; left:0; top:40px; overflow:hidden; z-index:1; /*防止本机Windows上的触摸事件*/ -ms-touch-action:none; /*防止callouttap-hold和文本的选择*/ -webkit-touch-callout:none; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none; /*防止文本调整取向变化对web应用程序很有用*/ -webkit-text-size-adjust:none; -moz-text-size-adjust:none; -ms-text-size-adjust:none; -o-text-size-adjust:none; text-size-adjust:none; } .pull-loading{ text-align:center; height:40px; line-height:40px; display:flex; align-items:center; justify-content:center; } 第四步:给需要拖动来加载数据的大div加一个id,id为wrapper第五步:给加载数据的div一个id,叫做scroller,注意,scroller的id必须放在wrapper的id里面第四步第五步的图如下:最后一步,使用ajax去调用上面写的方法: varmyscroll=newiScroll("wrapper",{ onScrollMove:function(){//拉动时 //上拉加载 if(this.y

判断ajax返回是否为json格式并处理

2019-06-15 10:04:20 阅读:2160

首先先上js代码,这里要注意,由于我用的是jquery的ajax,所以你想使用需要引用jquery.1.判断是否为json的JavaScript:functionisJSON(str){ if(typeofstr=='string'){ try{ varobj=JSON.parse(str); if(str.indexOf('{')>-1){ return1; }else{ return0; } }catch(e){ return0; } } return0; }2.页面上使用上面的方法:functionbuy_product(id,cate){ layer.confirm('您确定要购买该商品吗?',{btn:['确定','取消'],title:"提示"},function(){ $.ajax({ type:'POST', url:"/index.php/Index/1.html", dataType:"html", data:"id="+id+"&cate="+cate, success:function(responsestr){ varstr=isJSON(responsestr); if(str==1){ varobj=JSON.parse(responsestr); if(obj.s==10){ layer.msg('成功!',{shade:0.6,time:1000,end:function(){ $(".shop_section3").show();returnfalse; }}); }elseif(obj.s==2){ layer.alert(obj.msg,{icon:1,shade:0.8,end:function(){ window.location.href="/index.php/Login/2.html"; }});returnfalse; }elseif(obj.s==3){ layer.alert(obj.msg,{icon:1,shade:0.8,end:function(){ window.location.href="/index.php/My/3.html"; }});returnfalse; }else{ layer.alert(obj.msg,{shade:0.2});returnfalse; } }else{ layer.alert('系统正忙,请稍后再试!',{shade:0.2}); } }, error:function(){ layer.alert('系统繁忙,请稍后再试!',{shade:0.2}); } }); }); }程序里面这样写:/*开始首页商品购买*/ publicfunctionbuyproduct(){ $id=intval($_POST['id']); $cid=intval($_POST['cate']); /*用户有没有登陆*/ if(empty($_SESSION['fid'])){ $ary=array('s'=>2,'msg'=>'请您先登录!'); echojson_encode($ary);exit; } //....... }专门摘出来看一下:$.ajax({ type:'POST', url:"{:U('Set/transpoint')}", dataType:"html", data:"num="+num+"&tel="+tel, success:function(responsestr){ varstr=isJSON(responsestr); if(str==1){ varobj=JSON.parse(responsestr); if(obj.s==10){ layer.msg('成功!',{shade:0.6,time:1000,end:function(){ returnfalse; }}); }else{ layer.alert(obj.msg,{shade:0.2});returnfalse; } }else{ layer.alert('系统正忙,请稍后再试!',{shade:0.2}); } }, error:function(){ layer.alert('系统繁忙,请稍后再试!',{shade:0.2}); } });

上报错误