源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

json实现jsp分页实例介绍(附效果图)

  • 时间:2020-03-15 13:48 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:json实现jsp分页实例介绍(附效果图)
json 在上篇文章已有详细介绍,json的既简单易懂,又传输迅速。并且能和javascript很好的融为一体。 在不需要添加jar的前提下,能够很好完成jsp分页问题。 下面具体介绍分页实例: [img]http://files.jb51.net/file_images/article/201304/2013426164433997.png?2013326164452[/img]   效果如图所示,采用jsp+servlet技术 首先:编写一个javaBean User.java
[url=<%=basePath%>]<title>My JSP 'regist.jsp' starting page</title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="cache-control" content="no-cache"> <meta http-equiv="expires" content="0"> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="This is my page"> <script type="text/javascript" src="js/prototype1.6.js"></script> <script type="text/javascript" src="js/jquery-1.4.4.js"></script> <script type="text/javascript"> var paging = 0; // function page(p){ /*if(p == 'next' && paging < 3){ paging ++; }else if(p == 'last' && paging > 1) { paging --; }else{ alert('错误'); }*/ if(p == 'next' && paging < 3){ paging ++; if(paging > 1){ $(":button:eq(0)").removeAttr('disabled'); } if(paging == 3){ $(":button:eq(1)").attr('disabled','disabled'); } }else if(p == 'last' && paging > 1){ paging --; $(":button:eq(1)").removeAttr('disabled'); if(paging == 1){ $(":button:eq(0)").attr('disabled','disabled'); } } createXmlHttpRequest(); xmlHttpRequest.onreadystatechange=back; var url = encodeURI("/json_page/Paging?page="+paging); xmlHttpRequest.open("GET",url,true); xmlHttpRequest.send(null); } //假设名字为xmlHttpRequest function createXmlHttpRequest(){ if(window.ActiveXObject){ xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttpRequest = new XmlHttpRequest(); } } //回调函数 function back(){ if( xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ var mgs = xmlHttpRequest.responseText; var persons = mgs.evalJSON(); //alert(mgs); $("table").empty(); $("table").append( $("<tr><td>id</td><td>用户名</td><td>密码</td><td>age</td></tr>")); for(var i = 0 ; i < persons.length;i++){ var person = persons[i]; var $tr = $("<tr><td>"+person.id+"</td><td>"+person.name+"</td><td>"+person.password+"</td><td>"+person.age+"</td></tr>"); $("table").append($tr); } } } </script> </head> <body> <input type="button" disabled="disabled" value="上一页" onclick="page('last');"/><input type="button" value="下一页" onclick = "page('next');"/> <table> <tr><td>id</td><td>用户名</td><td>密码</td><td>age</td></tr> </table> </body> </html>
另外:要有这两个js哦
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部