无刷新分页前端代码

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

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

觉得可用，就经常来吧！ 欢迎评论哦！ html5教程，巧夺天工，精雕玉琢。小宝典献丑了！

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！