jquery，ajax怎么动态更新表格

先定义一个表格，利用ajax首先加载一次数据。

<table id="t2">

<tr>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">序号</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">总交易数</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">成功交易数</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">成功百分比(%)</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">失败交易数</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">失败百分比(%)</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">未知交易数</span></div></td>

<td width="10%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">未知百分比(%)</span></div></td>

<td width="20%" height="22" background="images/bg.gif" bgcolor="#FFFFFF"><div align="center"><span class="STYLE1">统计时间段</span></div></td>

</tr>

</table>

然后在页面定义一个ajax方法定时去后台查询数据就可以。

function loadData(){

$.ajax({

type: "POST",

url: "<%=path %>/two",

dataType: "json",

data:{'startTime':startTime,'endTime':endTime},

success: function(returnedData){//查询成功之后填充表格

var html = ""

var tdHead = "<td height='20'><div align='center'><span class='STYLE1'>"

var tdFoot = "</span></div></td>"

$("#t2 tr:gt(0)").remove()//第一行是table的表格头不需清除。

for(var i=0i<returnedData.lengthi++){

var countInfo = returnedData[i]

var totalCount = countInfo.totalCount

var sucCount = countInfo.sucCount

var failCount = countInfo.failCount

var unknowCount = countInfo.unknowCount

var sucPercent = countInfo.sucPercent

var failPercent = countInfo.failPercent

var unknowPercent = countInfo.unknowPercent

var countTimeZone = countInfo.countTimeZone

html += "<tr>" + tdHead + (i + 1) + tdFoot +

tdHead + totalCount + tdFoot +

tdHead + sucCount + tdFoot +

tdHead + sucPercent + tdFoot +

tdHead + failCount + tdFoot +

tdHead + failPercent + tdFoot +

tdHead + unknowCount + tdFoot +

tdHead + unknowPercent + tdFoot +

tdHead + countTimeZone + tdFoot + "</tr>"

}

$("#t2").append(html)//将新数据填充到table

}

})

}

加cookie处理，思路很简单。方式有很多，我先随便写一种，觉得不合适给我留言。

首先对DB里面数据的数据加一个自增的列。记住自增的列。

cookie里面缓存已经读取的数据num值，每次ajax请求的时候自加一下，在放到cookie里面，类似分页原理

如果当前num大于等于数据库这个序列的最大值，可以判断数据库没有更新的数据

基本就这样，很简单，有问题，随时M。

//** 实例化Ajax -------

var ajax = null

//** 接收URL地址

var url = "./***.asp" //这个文件是你处理的文件

if(window.XMLHttpRequest){

ajax = new XMLHttpRequest()

}else if(window.ActiveXObject){

ajax = new ActiveXObject("Microsoft.XMLHTTP")

}else{

return

}

//** 需要POST的值，把每个变量都通过&来联接

var postStr = "uid="+ uid +"&pwd="+ pwd //这里是需要查询的参数 自定义 把ASP变量里的参数传进来即可

//** 通过Post方式打开连接

ajax.open("POST", url , true) //post get

//** 定义传输的文件HTTP头信息

ajax.setRequestHeader("Content-Type","application/x-www-form-urlencodedcharset=GB2312") //post 方法

//** 发送数据

ajax.send(postStr)

//** 返回数据的处理函数

ajax.onreadystatechange = function(){

var Mess

if (ajax.readyState == 4 &&ajax.status == 200){

//msg.innerHTML = ajax.responseText//id方式返回结果信息

Mess=ajax.responseText

//alert(ajax.responseText)//JSd出窗口方式返回结果信息

if (Mess=="登陆成功！"){

alert(ajax.responseText)

window.location.href='./' //转到页面

}else{

alert(ajax.responseText) //这里是显示处理结果返回的值

return true

}

}

}

}

以上是我做登陆提示的一段代码 如果需要其他数据 稍加修改即可 如果实时显示 需要做个定时器 多久显示一次

---