以下是全部代码,实现点击上一页和下一页输出分页内容:
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title>jquery拆分数组,按分页输出</title> <script src="js/jquery.min.js"></script> <script> $(function() { var a = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '10','11']; var clickCount = 0; var pageNum = 3; var aa= a.slice(0,pageNum); for (var i = 0; i < aa.length; i++) { var temps = ""; temps += "<li>"+ aa[i] + "</li>"; $("ul").append(temps); } $("#button1").click(function() { clickCount++; console.log("button1",clickCount); if((clickCount * 3) < a.length) { var temp = ""; for (var i = clickCount * 3; i < 3 * (clickCount + 1); i++) { if (i < a.length){ temp += "<li>"+ a[i] + "</li>"; } } $(this).next().next().empty(); $(this).next().next().append(temp); temp = temp.substr(0, temp.length - 1); } }); $("#button2").click(function() { clickCount--; console.log("button2",clickCount); if((clickCount * 3) < a.length) { var temp = ""; for (var i = clickCount * 3; i < 3 * (clickCount + 1); i++) { if (i < a.length){ temp += "<li>"+ a[i] + "</li>"; } } $(this).next().empty(); $(this).next().append(temp); temp = temp.substr(0, temp.length - 1); } }); }); </script> </head> <body> <button id="button1">aaa</button> <button id="button2">bbb</button> <ul> </ul> </body> </html>