ajax 分页2

最新推荐文章于 2024-11-04 16:03:38 发布

fywxin

最新推荐文章于 2024-11-04 16:03:38 发布

阅读量593

点赞数

文章标签： ajax function float url class date

本文链接：https://blog.csdn.net/fywxin/article/details/6507252

版权

Code:

<%@ page language="java" pageEncoding="UTF-8"%>
<html>
<head>
<link rel="stylesheet" href="/test2/css/my.css" type="text/css" media="screen" />
<script src="/test2/easyui/jquery-1.3.2.min.js"></script>
<script src="/test2/js/my.js"></script>
<script>
var page=1;
var rows=2;
var total=0;
var totalPage=0;
var queryStr="";
var colStr="";
$(document).ready(function(){
getDate(page,rows,queryStr,colStr);
$("#pageNum").keyup(function(event){
var keycode=event.which;
if(keycode==13){
setPage=parseInt($(this).val());
if(setPage==page)
return ;
if(setPage>totalPage)
page=totalPage;
else
page=setPage;
getDate(page,rows,queryStr,colStr);
}
});
$("#reloadPage").click(function(){
var url=window.location.href;
window.location="/test2/monitorMethod.do?page="+page+"&rows="+rows;
window.location.reload(true);
});
$("#nextPage").click(function(){
if(page==totalPage)
return ;
page=page+1;
getDate(page,rows,queryStr,colStr);
});
$("#prevPage").click(function(){
if(page==1)
return ;
page=page-1;
getDate(page,rows,queryStr,colStr);
});
$("#lastPage").click(function(){
if(page==totalPage)
return ;
page=totalPage;
getDate(page,rows,queryStr,colStr);
});
$("#firstPage").click(function(){
if(page==1)
return ;
page=1;
getDate(page,rows,queryStr,colStr);
});
$("#setRows").change(function(){
rows=parseInt($(this).val());
getDate(1,rows,queryStr,colStr);
});
$("#SIMsearch").click(function(){
queryStr=$("#SearchStr").val();
colStr=$("#listColumn").val();
getDate(1,rows,queryStr,colStr);
});
$("#SearchStr").keyup(function(event){
var keycode=event.which;
if(keycode==13){
$("#SIMsearch").click();
}
});
$("#addBut").click(function(){
openWin("/test2/method/add.jsp?total="+total+"&rows="+rows,"addReport",500,300);
});
});
function getDate(page,rows,queryStr,colStr){
var url="/test2/monitorMethod.do?page="+page+"&rows="+rows;
if(queryStr!="" || queryStr!="undefined")
url=url+"&queryStr="+queryStr;
if(colStr!="" || colStr!="undefined")
url=url+"&colStr="+colStr;
url=encodeURI(url);
$(".mask").css("display","block").css("width","100%").css("height","100%");
$(".mask-msg").css("display","block").css("top","49%").css("left","44%");
$.post(url,null,function(date){
var objs=eval(date);
$("#tDate tr").remove();
var j=1;
var TD=0;
for(var i in objs){
var obj=objs[i];
var TR="";
if(j%2==0)
TR="<tr class=alt>"
else
TR="<tr>"
$("#tDate").append(TR+"<td>"+j+"</td><td>"+obj.num+"</td><td>"+obj.name+"</td><td>"
+obj.fromTime+"</td><td>"+obj.valid+"</td><td>"+obj.issue+"</td><td>"
+"<div align=center><a href=# οnclick=openWin('/test2/monitorMethod.do?command=updateDetail&num="+obj.num+"','updateMethod',500,300);>详细</a>"
+" <a href=# οnclick=del('/test2/monitorMethod.do?command=delMonitorMethod&num="+obj.num+"');>删除</a>"
+" <a href=# οnclick=openWin('/test2/monitorMethod.do?command=updateInput&num="+obj.num+"&page="+page+"&rows="+rows+"','updateMethod',500,300);>修改</a></div></td></tr>");
if(j==1)
total=obj.total;
j++;
$("tbody tr td:eq("+TD+")").css("background","#F3F3F3").css("text-align","center");
TD=TD+7;
}
$(".mask").css("display","none");
$(".mask-msg").css("display","none");
if(total%rows==0)
totalPage=parseInt(total/rows);
else
totalPage=parseInt(total/rows)+1;
$("#pageNum").val(page);
$("#fromNum").html((page-1)*rows);
$("#toNum").html(page*rows);
$("#totalNum").html(total);
$("#totalPage").html(totalPage);
$("#tDate tr:odd").mouseover(function(){
$(this).removeClass("alt");
$(this).addClass("over");
}).click(function(){
$(this).removeClass("alt");
if($(this).attr("class").indexOf("beClick")==-1){
$(this).addClass("beClick");
}else{
$(this).removeClass("beClick");
$(this).addClass("alt");
}
});
$("#tDate tr:odd").mouseout(function(){
if($(this).attr("class").indexOf("beClick")==-1){
$(this).removeClass("over");
$(this).addClass("alt");
}
});
$("#tDate tr:even").mouseover(function(){
$(this).addClass("over");
}).click(function(){
if($(this).attr("class").indexOf("over")!=-1)
$(this).removeClass("over");
if($(this).attr("class")=="beClick")
$(this).removeClass("beClick");
else
$(this).addClass("beClick");
});
$("#tDate tr:even").mouseout(function(){
$(this).removeClass("over");
});
});
}
</script>
</head>
<body>
<div class="Big">
<div style="border-bottom:1px solid #ddd;height:24px;padding:2px 5px;background:#fafafa;">
<div style="float:left;font-size:12px;">
<select id="listColumn" name="listColumn">
<option value="" disabled="disabled">选择查找列</option>
<option value="num">编号</option>
<option value="name">监测方法</option>
<option value="fromTime">发布日期</option>
<option value="valid">有效年限</option>
<option value="issue">发布单位</option>
<option value="">所有列中查找</option>
</select>
<input type="text" id="SearchStr" name="SearchStr">
<a href="#" id="SIMsearch"><img src="/test2/images/search.png"/></a>
</div>
<div style="float:right;font-size:12px;">
<a href="#" id="searchBut"><img src="/test2/images/search.png"/>组合查找</a>
<a href="#" id="addBut"><img src="/test2/images/add.png"/>新增</a>
</div>
</div>
<div class="containDate">
<table class="dateView" id="tt">
<thead>
<tr>
<th width="20"></th>
<th width="90">编号</th>
<th width="180">监测方法</th>
<th width="100">发布日期</th>
<th width="80">有效年限</th>
<th width="180">发布单位</th>
<th width="180">操作</th>
</tr>
</thead>
<tbody id="tDate">
</tbody>
</table>
</div>
<div class="Pager">
<table class="select-page" style="float:left;height:20px;">
<tbody>
<tr>
<td><select id="setRows" name="setRows">
<option value="10">10</option>
<option value="20" selected="selected">20</option>
<option value="30">30</option>
<option value="40">40</option>
<option value="50">50</option>
</select>
</td>
<td><img src="/test2/images/panel_title.png"/></td>
<td><a href="#" id="firstPage"><img src="/test2/images/first.gif"/></a></td>
<td><a href="#" id="prevPage"><img src="/test2/images/prev.gif"/></a></td>
<td><img src="/test2/images/panel_title.png"/></td>
<td>第<input size="2" id="pageNum">页</td>
<td id="totalPage"></td>
<td><img src="/test2/images/panel_title.png"/></td>
<td><a href="#" id="nextPage"><img src="/test2/images/next.gif"/></a></td>
<td><a href="#" id="lastPage"><img src="/test2/images/last.gif"/></a></td>
<td><img src="/test2/images/panel_title.png"/></td>
<td><a href="#" id="reloadPage"><img src="/test2/images/load.png"/></a></td>
</tr>
</tbody>
</table>
<div style="float:right;">
<span style="line-height:30px;">第 <span id="fromNum"></span> 到 <span id="toNum"></span> 元素之<span id="totalNum"></span></span>
</div>
</div>
<div class="mask">
</div>
<div class="mask-msg">
请稍等，正在加载......
</div>
</div>
</body>
</html>