当前位置: 移动技术网 > IT编程>网页制作>Html5 > 无刷新分页前端代码

无刷新分页前端代码

2018年03月28日  | 移动技术网IT编程  | 我要评论

诗琪,石家庄团购网站大全,阿迪力·买买提吐热

[html]  

<!DOCTYPE html>  

<html xmlns="https://www.w3.org/1999/xhtml">  

<head>   www.2cto.com

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  

    <title></title>  

    <script src="../Script/jquery-1.8.3.js" type="text/javascript"></script>  

    <script type="text/javascript">  

        $(function () {  

            $.post("Test.ashx", { "action": "getpagecount" }, function (data, status) {  

                for (var i = 1; i <= data; i++) {  

                    var td = $("<td><a href=''>" + i + "</a></td>");  

                    $("#trpage").append(td);  

                }  

  

                $("#trpage td").click(function (e) {  

  

                    e.preventDefault();  

  

                    $.post("Test.ashx", { "action": "getpagedata", "pagenum": $(this).text() }, function (data, status) {  

                        var comments = $.parseJSON(data);  

  

                        $("#ulorderlist").empty();  

  

                        for (var i = 0; i < comments.length; i++) {  

                            var comment = comments[i];  

                            var li = $("<li>" + comment.OrderID + "--" + comment.OrderDate + "</li>");  

                            $("#ulorderlist").append(li);  

                        }  

  

                    });  

  

                })  

            });  

  

  

        });  

    </script>  

</head>  

<body>  

    <ul id="ulorderlist">  

    </ul>  

    <table>  

        <tr id="trpage">  

        </tr>  

    </table>  

</body>  

</html>  

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网