各位园友,小弟在用JQuery中的ajax部分遇到一个问题:
在用ASP.NET结合JQuery+Ashx加载留言系统的时候,按分页读取出来的留言数据中提取出来留言ID再做一次Ajax去查询该留言对应的回复内容。具体代码如下:
var str;
/* 载入留言 */
var loadguest = function() {
$.ajax({
url: '/Ashx/GetMsgs.ashx',
type: "GET",
data: { page: page }, // 第几页
dataType: 'json',
beforeSend: function() {
},
error: function() {
alert('获取系统留言失败');
},
success: function(msg) {
$("#contact_msg").empty();
if (msg != "0") {
var data = msg.table;
str = "";
$.each(data, function(i, n) {
str += "<table width='100%' border='1' cellpadding='0' cellspacing='0' class='msg_table'>";
str += "<tr>";
str += "<td width='20%' rowspan='3' align='center' valign='top' class='tr_img'><p class='msg_ID'>ID:" + n.ID + "</p>";
str += "<img class='msg_headimg' src='" + n.Head + "' width='100' height='100'/><br/>";
str += "<span class='msg_name'>" + n.CustName + "</span><br/>";
str += "<span class='msg_ip'>" + n.IP + "</span></td>";
str += " <td width='80%' height='20' valign='middle'><span class='msg_title'>" + n.Title + "</span><span class='msg_date'>" + n.Dt + "</span></td>";
str += "</tr><tr>";
str += "<td height='120' valign='top' class='msg' id='msg_id" + n.ID + "'><p>" + n.Content + "</p>";
GetMsgRly(n.ID); //通过留言记录的ID去查询对应的回复,对str进行读写
str += "<div id='msg_rly" + n.ID + "' class='rly'><textarea name='textarea' id='textarea" + n.ID + "' cols='45' rows='5'></textarea>";
str += "<a href='javascript:;' title='点击回复' onlick='Submit(" + n.ID + ")'>回复</a> <a href='javascript:;' title='取消回复' onclick='CancelRly(" + n.ID + ")' id='Cancel" + n.ID + "'>取消</a> </div></td>";
str += "<tr><td height='20' valign='middle'><a href='#' title='点击和我聊天' class='msg_a'><img src='images/oicq.gif' /></a> <a href='#' title='点击给我发邮件' class='msg_a'><img src='images/email.gif' /></a> <a href='#' title='点击访问我的网站' class='msg_a'><img src='images/home.gif' /></a> <span class='msg_manager'> <a name='" + n.ID + "' href='javascript:;' title='点击回复该留言' onclick='ShowRly(" + n.ID + ")' class='msg_a'><img src='images/reply.gif' /></a> <a name='" + n.ID + "' href='javascript:;' title='点击删除该留言信息' onclick='DeleteMsg(" + n.ID + ")' class='msg_a'><img src='images/recycle.gif' /></a> </span></td>";
str += "</table>";
});
$("#contact_msg").append(str);
}
else {
alert("0");
}
}
})
}
/* 加载留言回复内容 */
var GetMsgRly = function(MsgID) {
$.ajax({
url: '/Ashx/GetMsgRly.ashx',
type: "GET",
data: { MsgID: MsgID },
dataType: 'json',
beforeSend: function() {
},
error: function() {
alert('获取系统留言回复失败');
},
success: function(rly) {
if (rly != "0") {
var rlydata = rly.table;
rlystr = "";
$.each(rlydata, function(i, r) {
/* 在这里对str进行操作离开该方法之后对str的操作就丢失了,但是实际上对应内容能够读写出来,用alert()能显示内容*/
str += "<span class='Msg_rly'><span class='Msg_rly_line'></span>";
str += "<span class='msg_rly_manager'>管理员回复:</span><br/>";
str += "<span class='Msg_rly_content'>" + r.Content + "</span> ";
str += "<span class='Msg_rly_Dt'>于" + r.Dt + "</span></span>";
});
}
}
});
}
结果是:留言记录能够读取出来的,但对应的留言回复内容却读取不出来!
PS:留言表和留言回复表存在不同的表中,通过留言表的主键ID进行关联。
不要质疑我后台代码,留言和留言内容是能够读取出来的,只是对str读写无效而已。
各位帮帮忙,为什么会这样呢?有什么办法能够解决?非常感谢!!!!!
代码执行到这里 GetMsgRly(n.ID) 不会等到 返回结果之后再执行 这个函数以后的内容
因为 GetMsgRly(n.ID) 为异步
把GetMsgRly(n.ID) 放在$("#contact_msg").append(str); 后 执行
然后在 指定的 html 容器里附加进 GetMsgRly(n.ID) 里的内容
你这里这样子写有问题出现在 $("#contact_msg").append(str);这里还没有把你的回复内容加载完成,也就是说在服务器端返回了数据,此时你正在装载这个数据但没完成,此时过程中你再次发起了ajax操作,问题出现在这里。建议可以再你标红的地方放一个空div,然后在 $("#contact_msg").append(str);这个语句执行完成后再调用GetMsgRly(MsgID) 函数去请求相关的记录,然后再append即可