前端js分页功能的实现,非常实用,新手必看 |
您所在的位置:网站首页 › 翻页功能 › 前端js分页功能的实现,非常实用,新手必看 |
//鼠标点击的时候搜索 function searchAction() { var serchId=$('#serchId').val(); $.ajax({ type:"post", url:"Web/search", data:{"search":serchId}, success:function (data) { if(data.total!=0){ $('#searchList').empty(); $.each(data.list,function (i,obj) { var lielem='\n' + ' \n' + ' \n' + ' '+obj.title+' \n' + ' \n' + ' \n' + ' \n' + ' \n' + ' '; $('#searchList').append(lielem); if(obj.className!= null){ var spanElem=''+obj.className+''; $('#className'+i).append(spanElem); } if(obj.creatTime!=null){ var emElem=''+obj.creatTime+''; $('#className'+i).append(emElem); } if(obj.detail != undefined || obj.detail != null){ var detailElem=''+obj.detail+' '; $('#detail'+i).append(detailElem); }}) //位置1 对数据进行分页 $('#pageination').show(); pagination(3,1); }else{ $('#searchList').empty(); var strNull=' 暂无相关搜索结果 ' + '返回首页 '; $('#searchList').append(strNull); $('#pageination').hide();} } }); } $('#serchId').on('keydown',function (event) { var e = event || window.event || arguments.callee.caller.arguments[0]; if (e && e.keyCode==13) { searchAction(); } }) //列表分页 //perPage 每一页显示条数 current:当前第几页 function pagination(perPage,current) { var tableData = document.getElementById("searchList"); var totalCount=tableData.rows.length; //总条数 //设置表格总页数 var totalPage=0;//列表的总页数 var pageSize = perPage; if (totalCount/pageSize > parseInt(totalCount/pageSize)){ totalPage = parseInt(totalCount/pageSize)+1; }else{ totalPage = parseInt(totalCount/pageSize); } //对数据进行分页 var currentPage=current; var startRow=(currentPage-1)*pageSize+1; var endRow=(currentPage*pageSize > totalCount ? totalCount : currentPage*pageSize); for(var i=1;i=startRow && i 1) { /* tempStr += "首页";*/ tempStr += "上一页" } /*中间页码的显示*/ /*如果总页数超出5个处理办法*/ if(totalPages= totalPages-4){ tempStr += ""+ 1 +""; tempStr+='......'; for(var pageIndex= totalPages-4 ; pageIndex =5 && current |
今日新闻 |
推荐新闻 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |