网页局部刷新 网页中有两个table,如何只刷新其中一个,而另外一个不刷新?高手赐教!有例子最好。 解决方案 » 免费领取超大流量手机卡,每月29元包185G流量+100分钟通话, 中国电信官方发货 LZ可以看这里http://download.csdn.net/source/620233 如果数据从后台来,就用ajax,在回调函数那里更新下想要刷新的表格数据就行了 用jQuery的话很好实现。首先页面上两个table。id为table1,table2.其次data为Ajax请求获得的数据。刷新$("#table1").empty();var tableStr = [];if(data.length>1){ for(var i=0;i<data.length;++i) //这里循环显示数据,根据你的数据格式自己修改 tableStr.push("<tr><td>",data[i],"</td></tr>");}tableStr = tableStr.join("");$("#table1").append(tableStr); 没用过ajax,还是不大懂!比如我现在又下面一个页面文件:如何只刷新t2,而不刷新t1?<html><head><title>NAC</title><meta http-equiv="Content-Type" content="text/html; charset=gb2312"></head><body text="#000000" link="#000000" vlink="#000000" alink="#000000"><table id="t1" width="200" border="1"> <tr> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> </tr></table><table id="t2" width="200" border="1"> <tr> <td> </td> <td> </td> </tr> <tr> <td> </td> <td> </td> </tr></table></body></html> 前台代码:<html> <head> <title>NAC </title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script type="text/javascript" src="jquery-1[1].3.2.min.js"></script><script type="text/javascript"> function GetNewTable() { //获取数据 $.ajax({ type: "post", url: "Handler.ashx", //获取数据的url data: { m: 'a' }, //发送的数据(可以不要这项) success: function(arr) { arr = eval(arr); //刷新方式一,当不能确定表格是否会改变时使用,既刷新前的行列数和刷新后的不一定相同 // $("#t1").empty(); // var tableStr = []; // tableStr.push("<tr><td>", arr[0].name, "</td><td>", arr[1].name, "</td></tr>"); // tableStr = tableStr.join(""); // $("#t1").append(tableStr); //刷新方式二,既刷新前的行列数和刷新后的一定相同时使用 // var tdArr = $("#t1 td"); // tdArr[0].innerHTML = arr[0].name; // tdArr[1].innerHTML = arr[1].name; } }); }</script></head> <body text="#000000" link="#000000" vlink="#000000" alink="#000000"> <table id="t1" width="200" border="1"> <tr> <td>1 </td> <td>2 </td> </tr> <tr> <td> </td> <td> </td> </tr> </table> <table id="t2" width="200" border="1"> <tr> <td>3 </td> <td> </td> </tr> <tr> <td>4 </td> <td> </td> </tr> </table> <input type="button" onclick="GetNewTable()" value="刷新table1" /></body> </html> 后台代码:<%@ WebHandler Language="C#" Class="Handler" %>using System;using System.Web;public class Handler : IHttpHandler { public void ProcessRequest (HttpContext context) { char method = Convert.ToChar(context.Request.Params["m"]); context.Response.ContentType = "text/plain"; string arraryA = "[{name:\"中国\"},{name:\"美国\"},{name:\"英国\"}]"; string arraryB = "[{name:\"中国1\"},{name:\"美国2\"},{name:\"英国3\"}]"; switch (method) { case 'a': context.Response.Write(arraryA); break; case 'b': context.Response.Write(arraryB); break; } } public bool IsReusable { get { return false; } }} 这个后台代码放Handler.ashx里面...不过是.net的后台代码,如果你是其它语言你就要自己写后台了,在公司,电脑上没装其它编译器主要功能就是输出数据,这个输出格式就json的数据格式,你自己写觉得麻烦就改成字符串,自己切割一下装入数组,前台代码绑定那修改下就好了 http://www.world-element.com/World-Element/product.asp?pp=1ajax,其实也可以用一种掩眼法,用js+css做一个假链接也行!你是想这样,进入看看效果 我后台是用的goahead webserver,一个开源的服务器,要怎么处理?或者还有没有别的办法实现这种局部刷新的? 这个Jquery是啥意思 javascript 高手进!!! 怎么禁止checkbox选项框为只读,类似input type=text readonly的效果。readonly对checkbox不起作用。使用disabled会使该选项值也无效 js 插入内容 这样的效果如何实现? javascript如何读写一个文本文件(不需要服务器解析) jQuery1.4 中逐个修改一句话中各个字的字体大小 紧急求助:按钮实现发信功能 关于刷新框架内页面的问题! 请教大家一个问题,弹出对话框 new 操作符原理的疑惑 [紧急]js动态添加div的问题(马上结贴)
首先页面上两个table。id为table1,table2.
其次data为Ajax请求获得的数据。
刷新
$("#table1").empty();var tableStr = [];
if(data.length>1){
for(var i=0;i<data.length;++i)
//这里循环显示数据,根据你的数据格式自己修改
tableStr.push("<tr><td>",data[i],"</td></tr>");
}
tableStr = tableStr.join("");
$("#table1").append(tableStr);
比如我现在又下面一个页面文件:如何只刷新t2,而不刷新t1?
<html>
<head>
<title>NAC</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body text="#000000" link="#000000" vlink="#000000" alink="#000000">
<table id="t1" width="200" border="1">
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<table id="t2" width="200" border="1">
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</body>
</html>
<html>
<head>
<title>NAC </title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script type="text/javascript" src="jquery-1[1].3.2.min.js"></script>
<script type="text/javascript">
function GetNewTable() {
//获取数据
$.ajax({
type: "post",
url: "Handler.ashx", //获取数据的url
data: { m: 'a' }, //发送的数据(可以不要这项)
success: function(arr) {
arr = eval(arr); //刷新方式一,当不能确定表格是否会改变时使用,既刷新前的行列数和刷新后的不一定相同
// $("#t1").empty();
// var tableStr = [];
// tableStr.push("<tr><td>", arr[0].name, "</td><td>", arr[1].name, "</td></tr>"); // tableStr = tableStr.join("");
// $("#t1").append(tableStr); //刷新方式二,既刷新前的行列数和刷新后的一定相同时使用
// var tdArr = $("#t1 td");
// tdArr[0].innerHTML = arr[0].name;
// tdArr[1].innerHTML = arr[1].name;
}
});
}
</script></head>
<body text="#000000" link="#000000" vlink="#000000" alink="#000000">
<table id="t1" width="200" border="1">
<tr>
<td>1 </td>
<td>2 </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
<table id="t2" width="200" border="1">
<tr>
<td>3 </td>
<td> </td>
</tr>
<tr>
<td>4 </td>
<td> </td>
</tr>
</table>
<input type="button" onclick="GetNewTable()" value="刷新table1" />
</body>
</html> 后台代码:
<%@ WebHandler Language="C#" Class="Handler" %>using System;
using System.Web;public class Handler : IHttpHandler
{
public void ProcessRequest (HttpContext context)
{
char method = Convert.ToChar(context.Request.Params["m"]);
context.Response.ContentType = "text/plain"; string arraryA = "[{name:\"中国\"},{name:\"美国\"},{name:\"英国\"}]";
string arraryB = "[{name:\"中国1\"},{name:\"美国2\"},{name:\"英国3\"}]";
switch (method)
{
case 'a':
context.Response.Write(arraryA);
break;
case 'b':
context.Response.Write(arraryB);
break;
}
}
public bool IsReusable {
get {
return false;
}
}}
不过是.net的后台代码,如果你是其它语言你就要自己写后台了,在公司,电脑上没装其它编译器
主要功能就是输出数据,这个输出格式就json的数据格式,你自己写觉得麻烦就改成字符串,自己切割一下装入数组,前台代码绑定那修改下就好了
我后台是用的goahead webserver,一个开源的服务器,要怎么处理?或者还有没有别的办法实现这种局部刷新的?