Ajxa callback 实时显示
小弟最近刚接触Ajax 但项目又催的比较紧
想请教各位大侠几个问题
1.在jsp页面中嵌入的
<script type="text/javascript">
function doclick() {
var url = "validate2.do?id="+test+"&id2="+test2;
if(window.XMLHttpRequest) {
req = new XMLHttpRequest();
}else if(window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = callback;
req.send(null);
}
function callback() {
if(req.readyState == 4 && req.status == 200) {
var check = req.responseText; //查看接收到的后台传过来的html命令
if(check !=""){
alert("前台接收到的"+check);
show (check);
};
};
}
function show(str) {
var show = str;
document.getElementById("status1").innerHTML = show;
if(str == "Disconnect") {
var show = "<img src="images/failed.gif" height="16" width="16"> <font color='red'> Sorry, Disconnect! Please reconnect.</font>";
document.getElementById("status1").innerHTML = show;
}else if( str == "TIMEOUT") {
var show = "<img src="images/failed.gif" height="16" width="16"> <font color='red'> Sorry, Connection time out!</font>";
document.getElementById("info").innerHTML = show;
}else if (str != null){
doclick(); //收到数据后继续执行doclick事件继续监听后台
};
}
这段代码中的callback 我现在想用callback 接收后台servlet的数据，后台servlet的主要代码是
out.write("Disconnect");
out.close(); //告诉JSP端结果
这个发送到前台jsp页面 ，目前这个功能能实现 前台可以接受到
但是！！ 但是！！ 但是！！
各位大侠，我还想做另外一个js
function doclick2() {
var td = event.srcElement; // 通过event.srcElement 获取激活事件的对象 td
var url = "validate2.do?id3="+td.id+"&id4="+td.name;
alert(td.id+td.name);
//创建一个XMLHttpRequest对象req
if(window.XMLHttpRequest) {
//IE7, Firefox, Opera支持
req = new XMLHttpRequest();
}else if(window.ActiveXObject) {
//IE5,IE6支持
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = callback;
//send函数发送请求
req.send(null);
}
就是当我想给后台再传另外的数据的时候，让后台的servlet重新给我另外的数据.
给后台的条件就是doclick2()中的新参数
现在后台能执行，但是前台不能显示后台传过来的数据了
怎么办呢？或者有什么别的办法解决呢
callback是不是不能重新绑定啊？ 目的就是想让最新条件的参数给后台
后台得到的数据再次显示到前台JSP页面上
已经研究一整天啦 实在不知道该怎么解决啦 谢谢各位啦
跪谢
[解决办法]
可以不用另外写callback，但是你要修改onreadystatechange添加的方法和callback增加参数区别是那种请求
function doclick() {
var url = "validate2.do?id=" + test + "&id2=" + test2;
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = function () { callback('doclick1'); }
req.send(null);
}
function callback(p) {
if (req.readyState == 4 && req.status == 200) {
var check = req.responseText; //查看接收到的后台传过来的html命令
if (check != "") {
alert("前台接收到的" + check);
show(check,p);
};
};
}
function show(str,p) {
//////
if (p == 'doclick1') {
var show = str;
document.getElementById("status1").innerHTML = show;
if (str == "Disconnect") {
var show = "<img src="images/failed.gif" height="16" width="16"> <font color='red'> Sorry, Disconnect! Please reconnect.</font>";
document.getElementById("status1").innerHTML = show;
} else if (str == "TIMEOUT") {
var show = "<img src="images/failed.gif" height="16" width="16"> <font color='red'> Sorry, Connection time out!</font>";
document.getElementById("info").innerHTML = show;
} else if (str != null) {
doclick(); //收到数据后继续执行doclick事件继续监听后台
};
}
else { //另外的点击事件
}
}
function doclick2() {
var td = event.srcElement; // 通过event.srcElement 获取激活事件的对象 td
var url = "validate2.do?id3=" + td.id + "&id4=" + td.name;
alert(td.id + td.name);
//创建一个XMLHttpRequest对象req
if (window.XMLHttpRequest) {
//IE7, Firefox, Opera支持
req = new XMLHttpRequest();
} else if (window.ActiveXObject) {
//IE5,IE6支持
req = new ActiveXObject("Microsoft.XMLHTTP");
}
req.open("GET", url, true);
req.onreadystatechange = function () { callback('doclick2'); }
//send函数发送请求
req.send(null);
}
