简单的js分页免刷新免跳转页面(即免&page=2页面跳转)

最新推荐文章于 2022-11-24 10:34:10 发布

djk8888

最新推荐文章于 2022-11-24 10:34:10 发布

阅读量2.7k

点赞数

分类专栏： JS代码 ASP.NET代码 html jquery

本文链接：https://blog.csdn.net/djk8888/article/details/53376851

版权

ASP.NET代码同时被 3 个专栏收录

126 篇文章 1 订阅

订阅专栏

html

97 篇文章 1 订阅

订阅专栏

JS代码

76 篇文章 1 订阅

订阅专栏

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="Comment.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="Scripts/jquery.min.js"></script>
    <script type="text/javascript">
        //初始化
        $(function () {
            getList(1);//默认第1页
        });
        //清空
        function ClearTable() {
            $("#myTb").empty();
            var tbBody = "<tr><th>编号</th><th>评论</th><th>日期</th></tr>";
            $("#myTb").append(tbBody);
        }
        //查询数据(参数：页码)
        function getList(p) {
            ClearTable();
            var size = 5;//每页几行数据
            var index = p;//页码
            $.ajax({
                type: "Post",
                url: "index.aspx/GetComment",
                data: "{'pageSize':" + size + ",'pageIndex':" + index + "}",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    json = $.parseJSON(data.d);
                    for (var i in json) {
                        var tbBody = "";
                        tbBody += "<tr align='center'>";
                        tbBody += "<td>" + json[i].ComID + "楼</td>";
                        tbBody += "<td>";
                        tbBody += json[i].ComText;
                        if (json[i].ComPIC != "" && json[i].ComPIC != null) {
                            tbBody += "<br /><img width='50px' src='upload/" + json[i].ComPIC + "' />";
                        }
                        tbBody += "</td>";
                        tbBody += "<td>" + json[i].ComDate + "</td>";
                        tbBody += "</tr>";
                        $("#myTb").append(tbBody);
                    }
                    Pages(p); //分页按钮
                },
                error: function (err) { }
            });
        }
        //分页按钮
        function Pages(p) {
            $("#pager").html("");
            var size = 5;//每页几行数据
            var index = p;//页码
            $.ajax({
                type: "Post",
                url: "index.aspx/GetCommentCount",
                data: "{'name':'" + name + "'}",
                dataType: "json",
                contentType: "application/json; charset=utf-8",
                success: function (data) {
                    var count = data.d;
                    if (count != null && count != 0) {
                        var pagecount = parseInt(count / size);//求总页数
                        var temp = count % size;//判断判断最后一页
                        if (temp > 0) {
                            pagecount = pagecount + 1;
                        }
                        var page = "";
                        for (var i = 0; i < pagecount; i++) {
                            if ((i + 1) == index) {
                                page += "<a style='color:red;'>[" + (i + 1) + "]</a> ";
                            }
                            else {
                                page += "<a style='color:blue;' οnclick='getList(" + (i + 1) + ")'>[" + (i + 1) + "]</a> ";
                            }
                        }
                        $("#pager").append(page);
                    }
                },
                error: function (err) { }
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <%--<h3>评论</h3>--%>
            <table id="myTb" style="width: 350px; border: solid 1px; font-size: small;" border="1" cellspacing="0" cellpadding="0"></table>
            <span id="pager"></span>
            <br />
            <a href="#" οnclick="getList(1)">刷新</a> | <a href="Comment.aspx" target="_top">我要评论</a>
        </div>
    </form>
</body>
</html>