<ul class="pagination pagination-sm no-margin pull-right"> <li><a class="first">首页</a></li> <li><a class="pre">上一页</a></li> <li><a class="next">下一页</a></li> <li><a class="last">尾页</a></li> <li><a class="rowCount">总记录数(0)</a></li> <li><a class="pageCount">总页数(0)</a></li> <li><a class="pageCurrent">当前页(0)</a></li></ul><script type="text/javascript"> function doSetPagination(page){ console.log("page",page) //1.初始化数据 rowCount总行数 pageCount总页数 pageCurrent当前页 $(".rowCount").html("总记录数("+page.rowCount+")"); $(".pageCount").html("总页数("+page.pageCount+")"); $(".pageCurrent").html("当前页("+page.pageCurrent+")"); //2.绑定数据(为后续对此数据的应用提供服务) $("#pageId").data("pageCurrent",page.pageCurrent); $("#pageId").data("pageCount",page.pageCount); } $(function(){ //事件注册 $("#pageId").on("click",".first,.pre,.next,.last",doJumpToPage); }) function doJumpToPage(){ //1.获取点击对象的clss值 var cls=$(this).prop("class");//Property //2.基于点击的对象执行pageCurrent值得批改 //2.1获取pageCurrent, pageCount的以后值 var pageCurrent=$("#pageId").data("pageCurrent"); var pageCount=$("#pageId").data("pageCount"); //2.2批改pageCurrent的值 if(cls=="first"){//首页 pageCurrent=1; }else if(cls=="pre"&&pageCurrent>1){//上一页 pageCurrent--; }else if(cls=="next"&&pageCurrent<pageCount){//下一页 pageCurrent++; }else if(cls=="last"){//最初一页 pageCurrent=pageCount; }else{ return; } //3.对pageCurrent值进行从新绑定 $("#pageId").data("pageCurrent",pageCurrent); //4.基于新的pageCurrent的值进行当前页数据查问 doGetObjects(); } function doGetObjects(){ //1.定义url和参数 var url ="doFindPageObjects"; //data是从指定元素上获取绑定的数据 //数据会在何时进行绑定?(setPagination,doQueryObjects) var pageCurrent = $("#pageId").data("pageCurrent"); //为什么要执行如下判断,而后初始化pageCurrent的值为1 //pageCurrent参数在没有赋值的状况下,默认初始值应该为1. if(!pageCurrent) pageCurrent=1; var params={"pageCurrent":pageCurrent}; //2.发动异步申请 //请问如下ajax申请的回调函数参数名能够是任意的吗??能够,必须合乎标识符的标准 $.getJSON(url,params,function(result){ //请问result是一个字符串还是json格局的js对象? 答:json格局对象 doHandleQueryResponseResult(result); }); }//非凡的ajax函数 </script>