jquery json 分页

nbh219

浏览: 274423 次
性别:
来自: 北京

最近访客更多访客>>

u010478936

changyuan126

BlueAeri

sahala79

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

jquery

<%@ page language="java" contentType="text/html;charset=utf-8"%>

String p = request.getContextPath();

String path = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+p+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<title>公告和待办事宜</title>

#content {

padding: 0;

margin: 0;

border-collapse:collapse;

}

td {

background: #fff;

font-size:12px;

width:270;

padding: 6px 6px 6px 12px;

color: #4f6b72;

}

td.alt {

background: #F5FAFA;

color: #797268;

}

A {text-decoration: NONE}

DIV.yahoo2 {

PADDING-RIGHT: 3px; PADDING-LEFT: 3px; FONT-SIZE: 0.85em; PADDING-BOTTOM: 3px; MARGIN: 3px; PADDING-TOP: 3px; FONT-FAMILY: Tahoma,Helvetica,sans-serif; TEXT-ALIGN: center

}

DIV.yahoo2 A {

BORDER-RIGHT: #ccdbe4 1px solid; PADDING-RIGHT: 8px; BACKGROUND-POSITION: 50% bottom; BORDER-TOP: #ccdbe4 1px solid; PADDING-LEFT: 8px; PADDING-BOTTOM: 2px; BORDER-LEFT: #ccdbe4 1px solid; COLOR: #0061de; MARGIN-RIGHT: 3px; PADDING-TOP: 2px; BORDER-BOTTOM: #ccdbe4 1px solid; TEXT-DECORATION: none

}

DIV.yahoo2 A:hover {

BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4

}

DIV.yahoo2 A:active {

BORDER-RIGHT: #2b55af 1px solid; BORDER-TOP: #2b55af 1px solid; BACKGROUND-IMAGE: none; BORDER-LEFT: #2b55af 1px solid; COLOR: #fff; BORDER-BOTTOM: #2b55af 1px solid; BACKGROUND-COLOR: #3666d4

}

DIV.yahoo2 SPAN.current {

PADDING-RIGHT: 6px; PADDING-LEFT: 6px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; COLOR: #000; MARGIN-RIGHT: 3px; PADDING-TOP: 2px

}

DIV.yahoo2 SPAN.disabled {

DISPLAY: none

}

DIV.yahoo2 A.next {

BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 0px 0px 10px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid

}

DIV.yahoo2 A.next:hover {

BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid

}

DIV.yahoo2 A.prev {

BORDER-RIGHT: #ccdbe4 2px solid; BORDER-TOP: #ccdbe4 2px solid; MARGIN: 0px 10px 0px 0px; BORDER-LEFT: #ccdbe4 2px solid; BORDER-BOTTOM: #ccdbe4 2px solid

}

DIV.yahoo2 A.prev:hover {

BORDER-RIGHT: #2b55af 2px solid; BORDER-TOP: #2b55af 2px solid; BORDER-LEFT: #2b55af 2px solid; BORDER-BOTTOM: #2b55af 2px solid

}

</style>

#module_list{margin-left:4px}

.modules{float:left; width:600px; height:270px; margin:10px; overflow:hidden; border:1px solid #acc6e9; background:#e8f5fe}

.m_title{height:24px; line-height:24px; background:#afc6e9}

#loader{height:24px; text-align:center}

.clear{clear:both}

</style>

</head>

<body>

</div>

</table>

</div>

</div>

</div>

</div>

</div>

</body>

queryNews();

audit();

function audit(){

$.ajax({

type: "Post",

url: "<%=path %>releaseNewsAction!audit.action",

contentType: "application/json; charset=utf-8",

dataType: "text",

success: function (data) {

var audit = eval(data);

var auditdata = "";

if(audit[0].jmmjxz){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民面积新增-审核" >'+audit[0].jmmjxz +'</a>'+'<br/>';

}

if(audit[0].jmmjbg){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民面积变更-审核" >'+audit[0].jmmjbg +'</a>'+'<br/>';

}

if(audit[0].jmfytz){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民费用调整-审核" >'+ audit[0].jmfytz+'</a>'+'<br/>';

}

if(audit[0].jmfyhj){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民费用核减-审核" >'+ audit[0].jmfytz+'</a>'+'<br/>';

}

if(audit[0].jmtg){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民停供-审核" >'+ audit[0].jmtg+'</a>'+'<br/>';

}

if(audit[0].jmcw){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民拆网-审核" >'+audit[0].jmcw+'</a>'+'<br/>';

}

if(audit[0].jmcwhf){

auditdata = auditdata+'<a href="<%=path %>UtilAction!returnPage.action?returnUrl=webPage/sf_audit/audit_search.jsp?lxmc=居民拆网恢复-审核" >'+ audit[0].jmcwhf+'</a>'+'<br/>';

}

$("#audit").html(auditdata);

error: function (err) {

alert("错误");

}

});

}

function queryNews(){

$(function () {

$.post("<%=path %>releaseNewsAction!nuewList.action", null, function (data) {

var count = eval(data);

var total = count[0].total;

PageClick(1, total, 3);

});

PageClick = function (pageIndex, total, spanInterval) {

$.ajax({

url: "<%=path %>releaseNewsAction!nuewList.action",

data: { "PageIndex": pageIndex },

type: "post",

dataType: "json",

success: function (data) {

//索引从1开始

//将当前页索引转为int类型

var intPageIndex = parseInt(pageIndex);

//获取显示数据的表格

var table = $("#content");

//清楚表格中内容

$("#content tr").remove();

//向表格中添加内容

for (var i = 0; i < data.length; i++) {

table.append(

$("<tr onclick='ShowDiv("+data[i].nr+")' ><td>" +

data[i].mc

+ "</td><td>" +

data[i].kssj

+ "</td><td>" +

data[i].zt

+ "</td><td>" +

data[i].nr

+ "</td></tr>")

);

} //for

//创建分页

//将总记录数结果得到总页码数

var pageS = total

if (pageS % 10 == 0) pageS = pageS / 10;

else pageS = parseInt(total / 10) + 1;

var $pager = $("#pager");

//清楚分页div中的内容

$("#pager span").remove();

$("#pager a").remove();

//添加第一页

if (intPageIndex == 1)

$pager.append("<span class='disabled'>第一页</span>");

else {

var first = $("<a href='javascript:void(0)' first='" + 1 + "'>第一页</a>").click(function () {

PageClick($(this).attr('first'), total, spanInterval);

return false;

});

$pager.append(first);

}

//添加上一页

if (intPageIndex == 1)

$pager.append("<span class='disabled'>上一页</span>");

else {

var pre = $("<a href='javascript:void(0)' pre='" + (intPageIndex - 1) + "'>上一页</a>").click(function () {

PageClick($(this).attr('pre'), total, spanInterval);

return false;

});

$pager.append(pre);

}

//设置分页的格式这里可以根据需求完成自己想要的结果

var interval = parseInt(spanInterval); //设置间隔

var start = Math.max(1, intPageIndex - interval); //设置起始页

var end = Math.min(intPageIndex + interval, pageS)//设置末页

if (intPageIndex < interval + 1) {

end = (2 * interval + 1) > pageS ? pageS : (2 * interval + 1);

}

if ((intPageIndex + interval) > pageS) {

start = (pageS - 2 * interval) < 1 ? 1 : (pageS - 2 * interval);

}

//生成页码

for (var j = start; j < end + 1; j++) {

if (j == intPageIndex) {

var spanSelectd = $("<span class='current'>" + j + "</span>");

$pager.append(spanSelectd);

} //if

else {

var a = $("<a href='javascript:void(0)'>" + j + "</a>").click(function () {

PageClick($(this).text(), total, spanInterval);

return false;

});

$pager.append(a);

} //else

} //for

//上一页

if (intPageIndex == total) {

$pager.append("<span class='disabled'>下一页</span>");

}

else {

var next = $("<a href='javascript:void(0)' next='" + (intPageIndex + 1) + "'>下一页</a>").click(function () {

PageClick($(this).attr("next"), total, spanInterval);

return false;

});

$pager.append(next);

}

//最后一页

if (intPageIndex == pageS) {

$pager.append("<span class='disabled'>最后一页</span>");

}

else {

var last = $("<a href='javascript:void(0)' last='" + pageS + "'>最后一页</a>").click(function () {

PageClick($(this).attr("last"), total, spanInterval);

return false;

});

$pager.append(last);

}

} //sucess

}); //ajax

}; //function

}); //ready

}

function ShowDiv(nr){

document.getElementById("MyDiv").style.display='block';

document.getElementById("fade").style.display='block' ;

var bgdiv = document.getElementById("MyDiv");

bgdiv.style.width = document.body.scrollWidth - 200;

$("#"+"fade").height($(document).height());

$("#newsdata").html(nr);

};

//关闭弹出层

function CloseDiv(show_div,bg_div)

{

document.getElementById("MyDiv").style.display='none';

document.getElementById("fade").style.display='none';

}

</script>

</html>

分享到：

struts2 下载 | java 执行后台返回json数据

2014-03-14 13:06
浏览 508
评论(0)
分类:编程语言
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论