2

image.png

<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>









Tony猿
25 声望4 粉丝