JS下拉自动加载
2015-07-23 15:06
483 查看
导入jquery.mousewheel.js
定义url=路径
JS
AJAX数据 (PHP)
定义url=路径
JS
$(function(){ /* * 滑动加载 * */ var page = 1; var end = 0; //1代表全部加载完毕 var plist = $('.product-list'); function getData(){ notice.text('正在加载···'); $.ajax({ async : true, type : 'post', url : url, data : {'page':page,'bid':bid,}, dataType: 'json', success : function(msg){ if(msg.status==1){ page=msg.next; if(msg.end==1){ end=1; } for(var r=0;r<msg.result.length;r++){ console.log(msg.result[0].title); str='<li><a class="back block" title="'+msg.result[r].title+'" href="'+link+msg.result[r].id+'" style="background-image :url('+rt+msg.result[r].img+')"></a></li>'; plist.append(str); } } console.log(msg.info); //调试 }, error : function(){ console.log('网络出现故障!'); } }); } getData(); //初始化一页数据 $('body').mousewheel(function(event) { if(end!=1&&($('body').scrollTop()>(plist.offset().top+plist.height()-$(window).height()-200))){ getData(); } console.log($('body').scrollTop()); console.log(plist.offset().top+plist.height()); }); });
AJAX数据 (PHP)
function ajaxList(){ if(!IS_POST){ $data['status'] = 0; $data['info'] = '非法请求'; $this->ajaxReturn($data,'JSON'); }else{ $page = intval($_POST['page']); //当前页码 $bid = intval($_POST['bid']); //类别 0为所有 if($bid){ $where['bid']=$bid; } $number = 6; //每次请求的数量 $count = M('Product')->where($where)->count(); //总数量 $pageCount = ceil($count/$number); //总页数 /* 开始请求 */ if($page>$pageCount){ $data['status'] = 0; $data['info'] = '没有更多的新片了'; $this->ajaxReturn($data,'JSON'); }else{ $sql = M('Product'); $result = $sql->where($where)->order('sort desc,id desc')->limit(($number*($page-1)).','.$number)->select(); $data['status'] = 1; $data['result'] = $result; $data['sql'] = $sql->getLastSql(); if($page==$pageCount){ $data['next'] = $page; $data['info'] = '新片已全部加载'; $data['end'] = 1; }else{ $data['next'] = $page+1; $data['info'] = '点击加载更多'; } $this->ajaxReturn($data,'JSON'); } } }
相关文章推荐
- JavaScript权威指南科13章 webj浏览器avascript
- javascript之使用Ajax事件
- JS点击复制
- html中js取值
- JSON学习笔记
- js正则表达式中exec用法实例
- JS 数组相关操作
- JavaScript实现获得所有兄弟节点的方法
- jsp学习笔记
- JavaScript基础1:JavaScript 错误 - Throw、Try 和 Catch
- 【工作笔记0002】(ajax)多个select标签异步取值刷新
- C# json提取多层嵌套到数组
- JavaScript 秘密花园 (很棒的Blog)
- JavaScript权威指南_135_第15章_脚本化文档_15.8-文档和元素的几何形状和滚动-判定元素在某点
- javascript之Ajax起步
- Hibernate 后台json封装
- JS获取页面高度方法小结
- HTMLFormElement获取表单里面所有的值然后以json形式返回
- js 计算剩余 天、时、分、秒
- fastjson用法1