1 @{ 2 Layout = null; 3 } 4 5 <!DOCTYPE html> 6 7 <html> 8 <head> 9 <meta name="viewport" content="width=device-width" /> 10 <title>AjaxPage</title> 11 <script src="/Scripts/jquery-1.7.1.js"></script>
<style>
li {float:left;list-style:none
}
</style>
12 @*JS分页： 界面中需要一个id为uu1的<ul>标签作为页码的盛放地*@ 13 <script type="text/javascript" > 14 function Pager(urlFormat, totalSize, pageSize, currentPage) { 15 var totalPage = Math.ceil(totalSize * 1.0 / pageSize); 16 var min = Math.max(2, currentPage - 4); 17 var max = Math.min(totalPage - 1, currentPage + 4); 18 if (currentPage == 1) { 19 $('<li>首页</li>').appendTo($('#uu1')); 20 } else { 21 $('<li><a href="' + urlFormat.replace('{pagenum}', 1) + '">首页</a></li>').appendTo($('#uu1')); 22 } 23 for (var i = min; i <= max; i++) { 24 var url = urlFormat.replace('{pagenum}', i); 25 26 if (currentPage == i) { 27 $('<li>' + i + '</li>').appendTo($('#uu1')) 28 } 29 else { 30 $('<li><a href="' + url + '">' + i + '</a></li>').appendTo($('#uu1')) 31 } 32 } 33 if (currentPage == totalPage) { 34 $('<li>末页</li>').appendTo($('#uu1')); 35 } else { 36 $('<li><a href="' + urlFormat.replace('{pagenum}', totalPage) + '">末页</a></li>').appendTo($('#uu1')); 37 } 38 } 39 </script> 40 @*获取超链接参数：获取MVC地址栏URL路径的最后参数*@ 41 <script type="text/javascript"> 42 function GetUrlFromMvc() { //从MVC地址栏获得最后参数 43 var hre=window.location.href; 44 var lastIndex = hre.lastIndexOf('/'); 45 var val = hre.substr(lastIndex + 1, 3); //获得参数 //（假设参数3或者设置更多） 46 return val; 47 } 48 </script> 49 @*窗口加载时分页*@ 50 <script type="text/javascript"> 51 $(function () { 52 var pagenum = GetUrlFromMvc() == null ? 1 : GetUrlFromMvc(); 53 $.post('/Home/AjaxPage', { pagenum: pagenum }, 54 function (data) { 55 if (data.status == 'ok') { 56 var t_CUSTOMERs = data.t_CUSTOMERs; 57 for (var i = 0; i < t_CUSTOMERs.length; i++) { 58 $('<tr><td>' + t_CUSTOMERs[i].ID + '</td><td>' + t_CUSTOMERs[i].NAME + '</td></tr>').appendTo($('#tab1')); 59 } 60 var currentPage = data.page.currentPage; 61 var pageSize = data.page.pageSize; 62 var totalSize = data.page.totalSize; 63 var urlFormat = data.page.urlFormat; 64 //拼接页码 65 Pager(urlFormat, totalSize, pageSize, currentPage); 66 } else if (data.status == 'error') { 67 alert(data.msg); 68 } else { 69 alert(data.status+'错误'); 70 } 71 }, 'json'); 72 }); 73 </script> 74 </head> 75 <body> 76 <div> 77 <table id="tab1"> 78 <tr><td>ID</td><td>NAME</td></tr> 79 </table> 80 </div> 81 <div> 82 <ul id="uu1"> 83 84 </ul> 85 </div> 86 </body> 87 </html>