关于ASP+ajax异步修改的问题

Question

点击要修改的内容，出现输入框（框中有原先的内容），输入完新的内容后，鼠标点击其他地方，无刷新提交并显示新的内容
我这个代码点击后是出现了文本框，但是改了内容后，点其他地方，他不会提交，一直是文本框，请高手们不吝赐教，最好把代码贴出来，小弟拜谢！~~
<script language="javascript">
var req;
var gID;
function init(){
if(window.XMLHttpRequest){
req=new XMLHttpRequest();
}
else if(window.ActiveXObject){
req=new ActiveXObject("Microsoft.XMLHttp");
}
}

function changeToInput(id){
var oId=document.getElementById(id);
var value=oId.value;
oId.outerHTML="<input type='text' id='"+id+"' value='"+value+"' onblur=change(this.id) size=3 />"
}

function change(id){
var oId=document.getElementById(id);
var px=oId.value;
gId=oId.id
init();
url="pro_px.asp?id="+id+"&px="+px;
req.open("GET",url,true);
req.onreadystatechange=callback;
req.send(null);
}

function callback(){

if(4==req.readyState){
if(200==req.status){

var oId=document.getElementById(gId);
var value=oId.value;
oId.outerHTML="<span style='' id='"+gId+"' value='"+value+"' onclick=changeToInput(this.id)>"+value+"</span>"
}
}
}
</script>
<%do while not rs.eof%>
<tr class="tdbg">
<td width="39" align="center" bgcolor="#ECF5FF"><%=rs("id")%></td>
<td height="90" align="center" valign="middle" bgcolor="#ECF5FF"><img src="../<%=rs("cpurl")%>" width="100" height="80" border="0" /></td>
<td align="center" bgcolor="#ECF5FF"><span id="<%=Rs("id")%>" value="<%=Rs("px")%>" onclick="changeToInput(this.id)"><%=Rs("px")%></span></td>
<td align="center" bgcolor="#ECF5FF"><%=rs("cpname")%></td>
<td align="center" bgcolor="#ECF5FF"><%=rs("times")%></td>
<td width="111" align="center" bgcolor="#ECF5FF">| <a href="pro_modi.asp?ID=<%=rs("id")%>">修改</a> | <a href="pro_Del.asp?ID=<%=rs("ID")%>&Action=Del" onClick="return ConfirmDel();">删除</a></td>
</tr>
<%
i=i+1
if i>=MaxPerPage then exit do
rs.movenext
loop
%>

处理页面
<!--#include file="conn.asp"-->
<%id=request("id")
px=request("px")
set rs=server.createobject("adodb.recordset")
sql="select * from cp where id="&id
rs.open sql,conn,1,3
rs("px")=px
rs.update
end if
rs.close
set rs=nothing
Response.Expires = 0
Response.Expiresabsolute = Now() - 1
Response.AddHeader "pragma","no-cache"
Response.AddHeader "cache-control","private"
Response.CacheControl = "no-cache"
'-------------------------------------------
response.Charset="GB2312" '//数据返回的编码类型 显示中文数据必须
'-------------------------------------------
%>

Answer 1

因为不能测试你服务端的程序，所以只对你客户端脚本代码进行了修改，经测试完全能达到你的要求，如果你用以下代码还是有问题，就要检测你的 pro_px.asp 是否正常工作 了！！
<script language="javascript">
var req;
var gID;
function init(){
if(window.XMLHttpRequest){
req=new XMLHttpRequest();
}
else if(window.ActiveXObject){
req=new ActiveXObject("Microsoft.XMLHttp");
}
}

function changeToInput(id){
var oId=document.getElementById(id);
var value=oId.value;
oId.outerHTML="<input type='text' id='"+id+"' value='"+value+"' onblur=change(this.id) size=10 />"
}

function change(id){
var oId=document.getElementById(id);
var px=oId.value;
//以下放异步处理代码 因为无测试所以注掉，正式使用请取消注释，并注掉测试代码
//init();
gId=oId.id
//init();
//url="pro_px.asp?id="+id+"&px="+px;
//req.open("GET",url,true);
//req.onreadystatechange=callback;
//req.send(null);
callback();//此句是测试代码
}

function callback(){
//正式代码请取消以下注释
//if(4==req.readyState){
//if(200==req.status){
var oId=document.getElementById(gId);
var value=oId.value;
oId.outerHTML="<span style='' id='"+gId+"' value='"+value+"' onclick=changeToInput(this.id)>"+value+"</span>"
//}
//}
}
</script>
<table border="1" width="600">
<tr class="tdbg">
<td width="39" align="center" bgcolor="#ECF5FF">10001</td>
<td height="90" align="center" valign="middle" bgcolor="#ECF5FF">112</td>
<td align="center" bgcolor="#ECF5FF"><span id="10001" value="aabbc" onclick="changeToInput(this.id)">ccccc</span></td>
<td align="center" bgcolor="#ECF5FF">aaaa</td>
<td align="center" bgcolor="#ECF5FF">bbbbb</td>
<td width="111" align="center" bgcolor="#ECF5FF">| <a href="pro_modi.asp?ID=10001">修改</a> | </td>
</tr>
</table>

Answer 2

AJAX是客户端与服务端进行的数据层交互。也就是说客户端请求的只是服务端的数据，而显示与定位等都并由客户端进行的显示。大量的定位或显示代码出现在客户端时称之为“肥客户端”设计，而如果同时返回定位，显示格式化时，代码还是压在了服务端，这种情况称为“瘦客户端”设计。但两者的区别是数据的交换量变大了。

既然是数据层的交互，那么实际上编码并不是一个客户端所了解的事。所以应该在后台支持文件中将其编码设定好的。也就是后台如果是gb2312或是gb65001情况，前台接收时才会改动相应的编码而不会出现乱码的现象。

好在GB2312是一种汉语的页面编码标准，是双字节标准。如果后台是使用了这样的编码时，前台接收时本来应该同样使用GB2312相对应的，但双字节的处理方式恰好能使用UFT-8,ISO-8859,Unicoded等形式是可以接收到不乱码的中文字符的。但不是一种自适应，而中文进行组码时如果前一个字节在于80H时自动将两个字节做为一个汉字，汉字编码首位是1，所以我们常说汉字编码是负数。所以几种情况都这样解释，才会出现中文不乱码。但由于编码不仅仅是汉字一项，同时编码规则中含类似日期格式，小数点格式，币种表示方式等等各方面的内容。而这些并不见得是相同的。当然对于多语言包的机器，如果使用了其他国家的语言，而客户机区域文化不同时会显示成其他的语言版本。也就是说，不管你使用了什么编码方式，选择语言才是客户机自适应的。比如，你后台用的是GB2312，通知前台使用了GB2312，而在前台页面中使用UFT-8或是unicoded时，中国的机器访问是出现的中文，但日期格式可能不符合中国的习惯，货币等也是。此时若是国外比如日本，朝鲜等，他们访问会出现他们的语言习惯。但如果前台是gb2312至少是不管你是什么国家，都是出现的中文编码。

所以，你的第一个问题，AJAX是数据的一种格式，对于数据的编码应该是有目的的，AJAX只是一个网络上传送的数据，它本身没有所谓的编码的。所以也不会出现AJAX自适应这样的方式。

第二个问题，同理，客户机在进行浏览时，根据它们具体的文化的不同，对任何网页都是调用相应的文化页面。除非你事先规定了编码。所以对于多语言的网页，是根据不同的文化而转向了不同的链接。如果没有设置编码时，或是没有安装相应的语言包时，会出现乱码，而就是与浏览器使用不同文化而产生的。所以他们都不会转的。

具体说来，AJAX涉及到的编码范围与正常网页涉及的没有什么区别。所以可以说AJAX没有功能，它只是利用现有的几种技术手段对服务器与客户机而形成的一种无刷新的数据交换而已。