<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> <html> <head> <c:import url="../common/resource.jsp"></c:import> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>手机列表</title> </head> <!-- javScript --> <script type="text/javascript"> $(function () { displayData(0); }); /*回调函数dispalyData START*/ function displayData(pageNo){ var total ; var pageSize = $("#pageSize").val(); $.ajax({ url:"phone/getByPage", type:"get", cache:false,//解决浏览器缓存get请求页面问题 另一种方式是加时间戳 data:{ "pageNo":pageNo+1,//page "pageSize":pageSize//pageSize }, beforeSend:function(){ $("#message").text("正在进行分页查询请稍后..."); return true; }, success:function(jsonObject){ //{"total":100,"dataList":[{"id":"","code":"","name":"","remark":""},{},{}]} //清空tbody $("#phone_list_tbody").empty(); if(jsonObject.total==0){ $("#message").text("没有符合条件的记录"); }else{ total = jsonObject.total; $("#message").text("查询结果如下:"); var htmlString = ""; $.each(jsonObject.dataList,function(i,n){ htmlString +='<tr>'; htmlString +='<td><input type="checkbox" name="id" value="'+n.id+'"/></td>'; htmlString +='<td>'+(i+1)+'</td>'; htmlString +='<td>'+n.firstLetter+'</td>'; htmlString +='<td>'+n.phoneBrand+'</td>'; htmlString +='<td>'+n.model+'</td>'; htmlString +='<td>'+n.modelNum+'</td>'; htmlString +='<td>'+n.system+'</td>'; htmlString +='<td>'+n.resolution+'</td>'; htmlString +='</tr>'; }); //将上面拼接的html字符串追加到tbody中 $("#phone_list_tbody").append(htmlString); } //显示总记录条数 //$("#total").text(jsonObject.total); //显示总页数 //var pageCount = jsonObject.total%pageSize==0?jsonObject.total/pageSize:parseInt(jsonObject.total/pageSize)+1; //$("#pageCount").text(pageCount); //集成jquery.pagination翻页插件 $("#pagination").pagination(jsonObject.total, {//总记录条数 callback: displayData,//每次翻页的时候执行的回调函数 会给这个回调函数传递一个参数,参数代表页码的索引.比正常显示的页码小1 items_per_page:pageSize, //每页显示多少条记录 current_page:pageNo,//页码的索引 }); } }); } /*回调函数dispalyData END*/ </script> <body> <table align="center"> <tr> <td><span id="message"></span></td> </tr> </table> <table border="1px" align="center"> <tr bgcolor="white"> <td><input type="checkbox" id="checkbox_all" /></td> <td>序号</td> <td>首字母</td> <td>手机品牌</td> <td>手机型号</td> <td>机型</td> <td>系统</td> <td>分辨率</td> </tr> <tbody id="phone_list_tbody"></tbody> </table> <table align="center"> <tr> <td> <div id="pagination" ></div> </td> </tr> </table> </body> </html>
这是我的前台代码,用的是pagination插件,为什么我的ajax异步请求一直不停的发送请求到后台,求解答
data:{ "pageNo":pageNo+1,//page
"pageSize":pageSize//pageSize
},
这里面为什么传pageNo+1,应该是点击哪一页就传哪一页。
$("#pagination").pagination(jsonObject.total, {//总记录条数 callback: displayData,//每次翻页的时候执行的回调函数 会给这个回调函数传递一个参数,参数代表页码的索引.比正常显示的页码小1 items_per_page:pageSize, //每页显示多少条记录 current_page:pageNo,//页码的索引 });
这是你的代码 我看到你每次分页时都有一个回调函数displayData,应该是这样导致了会不停的执行请求操作
有种可能就是你后台接收有误,检查一下吧