项目分页操作，可使用mui，使用SQL在数据库里查数据
1、html
2、js
var row=10*(page-1);
select top 10 * from productRequest id not in ( select top "+row+" id from productRequest order by ID desc) order by ID desc
//初始化变量var count = 0;var page=0; //页码$(function () { mui.init({ pullRefresh: { container: '#pullrefresh', //此处id是想要上拉加载内容处的id down: { callback: pulldownRefresh }, up: { contentrefresh: '正在加载...', callback: pullupRefresh } } }); //下拉加载 function pulldownRefresh() { $(".rawcondata").html(""); $("#searchValue").val(""); $(".myheader").show(); $(".myheader2").hide(); $(".mui-pull-caption-down").text(""); setTimeout(function() { page =1; //初始化page为1 var row=10*(page-1); //row 依次为 0 10 20 30... inits(row,null); //初始化SQL方法 mui('#pullrefresh').pullRefresh().endPulldownToRefresh(); //refresh completed }, 1500); } // 上拉加载具体业务实现 function pullupRefresh() { setTimeout(function() { mui('#pullrefresh').pullRefresh().endPullupToRefresh((++count<0)); //参数为true代表没有更多数据了。 page ++; var val = $("#searchValue").val(); if(val !="") { //当搜索框有值时，第二个形参为input值，否则传null var row=10*(page-1); inits(row,val); }else { var row=10*(page-1); inits(row,null); } }, 1500); } if (mui.os.plus) { mui.plusReady(function() { setTimeout(function() { mui('#pullrefresh').pullRefresh().pullupLoading(); }, 1000); }); } else { mui.ready(function() { mui('#pullrefresh').pullRefresh().pullupLoading(); }); } }); //初始化 sql function inits(row,vals){ var compid = $('#companyid').val(); if(vals!=null) { //搜索框有值时,进行模糊查询 sql("select top 10 * from productRequest where company like '%"+vals+"%' and id not in ( select top "+row+" id from productRequest order by ID desc) order by ID desc", function (data) { resour(data,row); //初始化查数据 }); }else { sql("select top 10 * from productRequest id not in ( select top "+row+" id from productRequest order by ID desc) order by ID desc", function (data) { resour(data,row); //初始化查数据 }); } } //查找的数据 function resour(data,row) { for (var i = 0; i < data.length; i++) { var str = ' ' + ' ' + ' 企业名称 ' + ' 入库单号 ' + ' 申请编码 ' + ' 操作人 ' + ' 单据状态 ' + ' 操作时间 ' + ' 原料编码 ' + ' ' + ' ' + ' ' + ' ' + ' ' + ' '; $(".rawcondata").append(str); setRowData($("#s" +(row+ i)), data[i]); //此处是ttyu平台直接通过name填充数据的方法，可以使用拼字符的方式把变量拼到上面内容字符串中； } //数据为空时，弹框定时弹窗 if(data.length == 0) { $(".mixfirm").show(); mixfirm("没有更多数据"); setTimeout(function() { $(".mixfirm").hide(); },1000); } } //点击搜索按钮 function mysearch() { $(".myheader").hide(); $(".myheader2").show(); $(".rawcondata").html(""); //清空内容 } //点击返回键，将page变为初始值 $(".cancelleft").click(function() { $(".myheader2").hide(); $(".myheader").show(); $("#searchValue").val(""); $(".rawcondata").html(""); page =1; var row=10*(page-1); inits(row,null); }); //点击取消按钮 $(".searchCancel").click(function() { $("#searchValue").val(""); $(".rawcondata").html(""); }); /*定时弹框*/ function mixfirm(obj) { var strs = ''+obj+'
'; $(".mixfirm").html(strs); $(".mixfirm").show(); } /*点击search搜索*/ function search() { $(".rawcondata").html(""); var val = $("#searchValue").val(); if(val !="") { page =1; var row=10*(page-1); inits(row,val); }else { $(".mixfirm").show(); mixfirm("输入内容为空"); setTimeout(function() { $(".mixfirm").hide(); },1000); } } 3、弹框css
/*弹框css*/.mixfirm { width: 141px; height: 40px; background-color: #1084FB; opacity: 0.8; position: fixed; bottom: 50%; left: 50%; margin-left: -62px; margin-top: -20PX; text-align: center; display: none; padding: 0 10px; z-index: 30; border-radius: 30px;}.mixfirm h4 { margin-top: 13px; color: #fff;}