zoukankan      html  css  js  c++  java
  • js 分页

    <input type="hidden" id="pageIndex" name="pageIndex" value="1" />
            <input type="hidden" id="pageCount" name="pageCount" value="0" />
            <input type="hidden" id="pageSize" name="pageSize" value="6" />
            <input type="hidden" id="recordCount" name="recordCount" value="0" />
    
    
     <div id="fenye" class="badoo fenye">
                                        <div class="pageMsg"><span class="dispalyPageIndex"></span>页,共<span id="dispalyPageCount"></span>页,每页<span id="displayPageSize"></span>条 共<span id="displaRrecordCount"></span></div>
                                        <div class="pageNum">
                                            <a id="firstPage">首页</a>
                                            <a id="prevPage">上一页</a>
                                            <span class="dispalyPageIndex"></span>
                                            <a id="nextPage">下一页</a>
                                            <a id="endPage">尾页</a>
                                        </div>
                                    </div>
    View Code
     <style type="text/css">
            #fenye {
                height: 40px;
                line-height: 40px;
            }
    
                #fenye .pageMsg {
                    width: 40%;
                    float: left;
                    text-align: left;
                    color: #01479d;
                }
    
                #fenye .pageNum {
                    width: 60%;
                    float: left;
                    text-align: right;
                }
    
                #fenye a {
                    margin-right: 5px;
                    color: #01479d;
                }
    
                #fenye span {
                    margin-right: 5px;
                    color: #01479d;
                }
    
                #fenye .disabled {
                    cursor: not-allowed;
                    color: #989898;
                }
        </style>
    View Code
    if (parseInt($("#pageCount").val()) == parseInt($("#pageIndex").val())) {
                    $("#nextPage,#endPage").addClass("disabled");
                    $("#nextPage,#endPage").attr("href", "javascript:void(0);");
                }
                if (parseInt($("#pageCount").val()) == 1) {
                    $("#firstPage,#prevPage,#nextPage,#endPage").addClass("disabled");
                    $("#firstPage,#prevPage,#nextPage,#endPage").attr("href", "javascript:void(0);");
                }
                $("#fenye a").click(function () {
                    var pageIndex = parseInt($("#pageIndex").val());
                    var pageCount = parseInt($("#pageCount").val());
                    var id = $(this).attr("id");
                    var href = $(this).attr("href");
                    var curr = 1;
                    curr = id == "firstPage" ? 1 : parseInt(curr);
                    curr = id == "endPage" ? pageCount : parseInt(curr);
                    curr = id == "prevPage" ? parseInt(pageIndex - 1) : parseInt(curr);
                    curr = id == "nextPage" ? parseInt(pageIndex + 1) : parseInt(curr);
                    curr = curr > pageCount ? pageCount : parseInt(curr);
                    curr = curr <= 0 ? 1 : parseInt(curr);
                    if (href == "" || typeof (href) == "undefined") {
                        $("#pageIndex").val(curr);
                        GetContractByDept($("#DeptID").val(), '', '', '', '', '', '', $("#pageIndex").val(), $("#pageSize").val());
                    }
                })
    View Code
    function GetContractByDept(deptid, actName, actNum, beginTime, endTime, operator, oppOperator, pageIndex, pageSize) {
                $("#ContractList tbody tr").remove();
                $("#selectAll").get(0).checked = false;
                $.ajax({
                    url: 'Action.ashx?t=GetContractByDeptId',
                    data: { deptid: deptid, actName: actName, actNum: actNum, beginTime: beginTime, endTime: endTime, operator: operator, oppOperator: oppOperator, pageIndex: pageIndex, pageSize: pageSize },
                    type: 'POST',
                    dataType: "json",
                    success: function (result) {
                        if (result.success) {
                            $(result.data).each(function (index) {
                                var html = "";
                                html += "<tr>";
                                html += "<td><input type='button' class='btnPower' value='查看权限' data-url='ContractDeptUser.aspx?id=" + this.ID + "&OwnerName=" + this.OwnerDisplayName + "&OwnerTime=" + this.CreateTime + "' data-name='" + this.ContractName + "'/></td>";
                                html += "<td><input type='checkbox' name='chkDname' value='" + this.ID + "' data-contractName='" + this.ContractName + "' /></td>";
                                html += "<td>" + this.FileType + "</td>";
                                html += "<td>" + this.ContractName + "</td>";
                                html += "<td>" + this.FileSize + "</td>";
                                html += "<td>" + this.OwnerDisplayName + "</td>";
                                html += "<td>" + this.CreateTime + "</td>";
                                html += "</tr> ";
                                $("#ContractList tbody").append(html);
                            });
                            $("#pageIndex").val(result.pageIndex);
                            $("#pageSize").val(result.pageSize);
                            $("#recordCount").val(result.recordCount);
                            $("#pageCount").val(Math.ceil(result.recordCount / result.pageSize));
                            $(".dispalyPageIndex").text(result.pageIndex);
                            $("#displayPageSize").text(result.pageSize);
                            $("#dispalyPageCount").text($("#pageCount").val());
                            $("#displaRrecordCount").text($("#recordCount").val());
                            if ($("#ContractList tbody tr").length < 1) {
                                $("#ContractList tbody").html("<tr><td colspan='7' style='color:red;text-align:center;' >暂无数据</td></tr>");
                            }
                            $("input[name='chkDname']").click(function () {
                                if (!$(this).isChecked) {
                                    $("#selectAll").prop("checked", false);
                                }
                                var chsub = $("input[name='chkDname']").length;
                                var checkedsub = $("input[name='chkDname']:checked").length;
                                if (chsub == checkedsub) {
                                    $("#selectAll").prop("checked", true);
                                }
                            });
                            $(".btnPower").click(function () {
                                var url = $(this).attr("data-url");
                                var name = $(this).attr("data-name");
                                layer.open({
                                    type: 2,
                                    title: name,
                                    shadeClose: true,
                                    shade: 0.4,
                                    area: ['680px', '350px'],
                                    content: url
                                });
                            })
                        } else {
                            $("#ContractList tbody").html("<tr><td colspan='7' style='color:red;text-align:center;' >暂无数据</td></tr>");
                        }
                    }
                });
    
            }
    View Code

     

    收藏
    关注
    评论
  • 相关阅读:
    JavaScript类型转换
    JavaScript中的 typeof,null,和undefined
    JavaScript循环
    JavaScript条件语句
    JavaScript运算符
    JavaScript字符串
    JavaScript事件
    JavaScript对象,函数,作用域
    JavaScript基础
    数值数据的特征预处理
  • 原文地址:https://www.cnblogs.com/yidengbone/p/7261848.html
Copyright © 2011-2022 走看看