<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>NodeManager</title>
<link rel="stylesheet" href="/nd/css/style.css" type="text/css" media="all" />
<script type="text/javascript" src="/nd/js/jquery.min.js"></script>
<link rel="stylesheet" href="/nd/css/easydropdown.css" type="text/css" media="all" />
<script type="text/javascript" src="/nd/js/base.js"></script>
<script type="text/javascript" src="/nd/js/bindpage.js"></script>
<script type="text/javascript" src="/nd/js/jquery.tmpl.js"></script>
<script type="text/javascript" src="/nd/js/jquery.datepick.js"></script>
<script type="text/javascript" src="/nd/js/jquery.easydropdown.js"></script>
<link rel="stylesheet" href="/nd/css/jquery.datepick.css" type="text/css" media="all" />
<script id="UserListTmp" type="text/x-jquery-tmpl">
<tr data-grid="${id}">
<td style="text-align:center"><input type="checkbox" name="" id="${id}" /></td>
<td style="text-align:center">${index}</td>
<td style="text-align:center">${account}</td>
<td style="text-align:center">${name}</td>
<td >${role}</td>
</tr>
</script>
</head>
<body>
<script type="text/javascript">
//验证正则
var usernamecheck = /^[a-zA-Z0-9_.-]+[a-zA-Z0-9_.-]$/;
var emailcheck = /^([a-zA-Z0-9_\.\-])+@(([a-zA-Z0-9_\-])+\.)+([a-zA-Z0-9])+$/;
var phonecheck = /^0{0,1}(13[0-9]|15[0-9]|18[0-9])[0-9]{8}$/;
var xmcheck = /^[_\n\w\u4e00-\u9fa5]+$/;
var userList={
"total":3,
"start":0,
"row":3,
"data":
[
{
"id":299,
"account":"Configuration",
"name":"配置管理员",
"role":1,
"lang":0,"state":0
}，
{"id":302,
"account":"wj",
"name":"审计管理员",
"role":2,
"lang":0,
"state":0
}
]
}
$("#UserList tr:first>td:eq(1)").click();//默认列表第一条选中
var pager={
recordcount:0,
recordperpage:10,
startrecord:0,
pagecount:0,
currentpage:0,
url:document.location,
id:"#Pages",
init:function(id,purl,precordcount,pstartrecord,precordperpage){
this.url=purl;
this.recordcount=precordcount;
this.startrecord = pstartrecord;
this.recordperpage=precordperpage;
this.id = id;
return this;
},
bind:function(){
this.pagecount = Math.floor( (this.recordcount + this.recordperpage -1) / this.recordperpage);
this.currentpage = Math.floor( (this.startrecord + this.recordperpage -1) / this.recordperpage);
var dispaly_startpage = (this.currentpage>1&&this.pagecount>3?this.currentpage-1 :1);
var dispaly_endpage = (this.currentpage==this.pagecount ? this.pagecount : this.currentpage+1);
var prepagedom = $('>a:first',this.id);
var nextpagedom =$('>a:last',this.id);
if(this.pagecount <= 3){
prepagedom.hide();
nextpagedom.hide();
}else{
prepagedom.show();
nextpagedom.show();
}
if(this.recordcount > 0){
if(this.pagecount != 4){
for(i=dispaly_startpage;i<=dispaly_endpage;i++){
nextpagedom.before(' [url=javascript:;]' + i + '[/url] ');
}
}else{
for(i=1;i<=4;i++){
nextpagedom.before(' [url=javascript:;]' + i + '[/url] ');
}
}
}else{
i=1;
nextpagedom.before('[url=javascript:;]' + i + '[/url] ');
}
//8-8灏�
if(this.pagecount == 3&&dispaly_endpage<this.pagecount){
nextpagedom.before('[url=javascript:;]'+this.pagecount+'[/url] ');
}else if(this.pagecount == 4&&dispaly_endpage<this.pagecount){
nextpagedom.before('');
}else if(this.pagecount>dispaly_endpage){
if(this.pagecount - dispaly_endpage > 1){
nextpagedom.before('<span>...</span>[url=javascript:;]'+this.pagecount+'[/url]');
}else{
nextpagedom.before('[url=javascript:;]'+this.pagecount+'[/url] ');
}
}
//8-8灏圭粨鏉�
if(this.currentpage==3 && this.pagecount>4){
prepagedom.after(' [url=javascript:;]1[/url]');
}else if(this.currentpage>3 && this.pagecount>4){
prepagedom.after(' [url=javascript:;]1[/url]<span>...</span>');
}
//
if($("#pageinfospansec").length>0){
$("#pageinfospan").hide();//椤电爜淇℃伅
}
if(this.currentpage==1){
//prepagedom.addClass("grly") .removeClass("btnbox");
}else{
//prepagedom.removeClass("grly") .addClass("btnbox");
//prepagedom.attr("href",this.url+dispaly_startpage);
prepagedom.click(function(){getPage(dispaly_startpage)})
}
if(this.currentpage == this.pagecount){
//nextpagedom.addClass("grly") .removeClass("btnbox");
}else{
//nextpagedom.removeClass("grly") .addClass("btnbox");
//nextpagedom.attr("href",this.url+dispaly_endpage);
nextpagedom.click(function(){getPage(dispaly_endpage)})
}
$('input:text','div.fenyelistbox').bind('keydown', function(e){
Digit(this, e);
});
$('input:text','div.fenyelistbox').bind('mousedown', function(e){
WitchInput(this,e);
});
var jumpbtn = $('input.btn','div.fenyelistbox');
var btnurl=this.url;
var zongpage=this.pagecount;
var numcheck = /^\d+$/;
jumpbtn.click(function(){
var jumpnum=$('input:text','div.fenyelistbox').val();
if(jumpnum>zongpage){jumpnum=zongpage}
if(jumpnum=="0"){jumpnum=1}
if(!numcheck.test(jumpnum)){$('input:text','div.fenyelistbox').val("");return false};
switch(jumpnum){
case "":
return false;
break;
}
location.href =btnurl + parseInt(jumpnum,10);
});
var spantext="鍏�"+this.recordcount+"鏉＄鍚堟潯浠讹紝姣忛〉"+this.recordperpage+"鏉�"
$("#pageinfospan").text(spantext);
//7-29鏂板姞缁撴潫
return this;
}
}
$.ajaxSetup({
cache: false //鍏抽棴AJAX鐩稿簲鐨勭紦瀛�
});
//取值
function HTMLEncode(str){
var newStr = "";
if(!str){
return "";
}
//newStr = str.replace(/\\/g,"\\").replace(/\"/g,"\"").replace(/\'/g,"\'").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/ /g, " ").replace(/\n/g,"<br>");
newStr = str.replace(/\\/g,"").replace(/\"/g,"").replace(/\'/g,"").replace(/&/g,"&").replace(/</g,"<").replace(/>/g,">").replace(/ /g, " ").replace(/\n/g,"<br>");
return newStr;
}
function getUserList(){
$("#UserName1").show();
$("#UserName").hide();
$("#Pages").empty().html('[url=javascript:;]<i class="icon-prev"></i>[/url][url=javascript:;]<i class="icon-next"></i>[/url]');
$("#UserList").empty();
$.each(userList.data,function(i,item){
item.index = userList.start + i + 1;
var txt = "";
if(item.role == 0){
txt = "用户管理员";
}else if(item.role == 1){
txt = "配置管理员";
}else{
txt = "审计管理员";
}
item.role = txt;
});
$("#UserListTmp").tmpl(userList.data).appendTo("#UserList");
$("#UserList tr").each(function(){
var userid = $(this).data("grid");
var $tr = $(this);
$(">td",this).not(":first").on("click",function(){
getUserInfo(userid);
$tr.addClass("tron").siblings().removeClass("tron");
});
});
pager.init("#Pages","?page=",userList.total,userList.start+1,userList.row).bind();
// pager.init("#Pages","?guolv_account='+$('#guolv_account').val()+'&guolv_caoz='+('#guolv_caoz').val()+'&guolv_select'+('#guolv_select').val()+'page=",userList.total,userList.start+1,userList.row).bind();
}
<div class="user-list">
<table cellpadding="0" cellspacing="0" border="0" id="User_List" class="tabcont">
<thead>
<tr><th width="20"><input onChange="checkAll('#UserList',this)" type="checkbox" name="" /></th>
<th width="32">序号</th>
<th style="text-align:center">帐号</th>
<th width="172" style="text-align:center">姓名</th>
<th width="96">角色</th>
</tr>
</thead>
<tbody id="UserList">
</tbody>
</table>
<div class="tab-foot">
<!---->
<div class="ctrl">
[url=javascript:;]<i class="icon-plus"></i>添加[/url]
[url=javascript:;]<i class="icon-mins"></i>删除[/url]
</div>
<!---->
<div class="pages" id="Pages">
[url=javascript:;]<i class="icon-prev"></i>[/url]
[url=javascript:;]<i class="icon-next"></i>[/url]
</div>
</div>
</div>
</body>
</html>
0
顶
顶
6
踩
踩
分享到：
发表评论
-
js 判断浏览器语言 IE 谷歌 火狐....
2015-03-27 13:42 832方法1： window.navigat ... -
from 提交
2015-02-05 11:33 459<!DOCTYPE html PUBLIC ... -
checked
2015-02-03 10:20 602if($("#FTPFileRecordOp ... -
linux zip命令
2014-12-08 20:03 0linux zip命令 zip -r myfil ... -
html 点击跳转
2014-12-05 11:34 0printf(" &l ... -
html的一些笔记
2014-08-06 13:55 0style="text-decoration:non ... -
密钥管理页面的实现
2014-08-05 17:29 421实现的功能：可以实现公钥的管理 功能1：可以 ...
相关推荐
静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果静态页面分页效果
实现html静态页面分页，ul li的分页功能，实现首页，尾页，共几页，共几条，123的详细分页 的功能
页面分页, 下一页 ,上一页 切换..............................................................................................................................................................................
自定义页面分页标签自定义页面分页标签自定义页面分页标签自定义页面分页标签自定义页面分页标签
把在页面上的分页操作，在java类用一个对象封装，并且把整个分页的html标签封装在这个对象的String类型的属性里，在需要分页的地方，直接从后台取得这个对象，并把对象中的字符串用页面的内置out对象写到页面上，...
php写的页面分页，很基础，希望大家多下载看看
页面分页实现源代码java， 说明很详细，博客解析请看个人博客，搜索页面分页
高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高兼容度页面分页工具类高...
一个jsp页面分页项目一个jsp页面分页项目一个jsp页面分页项目
jsp中数据库在页面分页的实现 用存储过程实现分页 servlet分页 Oracle分页 MySQL 分页 自带数据库内容
代码实现了web分页功能 输入参数：查询表格名称、当前页码、每页显示最大记录数、分页栏步长 输出参数为Map集合，分别对应：总记录数、总页数、分页栏步长指数、起始页码、结束页码、上一页标识、下一页标识、当前...
使用velocity，静态页面分页的实现
csdn上有无刷新页面分页效果的源代码实现，但下载后不能够立刻观看到效果，所以，我将其源码进行了修改。希望能对大家有所帮助。
9种jquery纯页面分页排序，个人推荐：《JQuery排序分页a》与《jqueryPaginga》效果不错
该工具类，实现了前台的分页，使用该工具类，可以直接进行前台页面的分页。
jsp的页面分页，简单易懂，便于理解,无须用到servlet,可以很好地做到分页！
JS+JQuery1.2.6万能页面分页源码 只需要传入指定的几个参数就可以实现分页
JSP页面分页查询
asp.net实现静态页面分页http://www.besteast.com/BestEast-news-more.html
这是一段生成单个静态页面分页的程序代码，思考了很长时间写出来了。现在拿出来给大家分享一下，希望对您有所帮助。如果想查看示例效果，请登录www.51cuxiao.net网站。