多ajax同时请求，返回值后覆盖掉之前的请求结果，求解答！谢谢

单单P 2015-02-23 03:42:59

这个是前台显示页面：

需求：下拉框选择完演出，自动显示对应时间、地点、票价（可选）信息
问题：目前是单个ajax都能显示，多个就不行了，只显示最后一个（而且是同一个位置，应该是被覆盖了），看了一些文章也找不到合适的解决方法，求各位前辈指点！
前台代码：
function load(str){
showDate(str);
showPrice(str);
}
......
<form method="post" action="insert_ecode.php" name="form1">
<div class="container">
<div class="contact-input">
<label>演出名称</label><br>
<span class="dk_wrap">
<select name="pername" class="nojs" tabindex="1" onchange="load(this.value)">
<option value="">-请选择-</option>
<?php
include("conn.php");
$codetype = $_GET["codetype"];
$sql=mysql_query("select id,pername,price,rq from perform where codetype='$codetype'");
$row=mysql_fetch_array($sql);
$id = $row["id"];
mysql_data_seek($sql,0); //指针复位
while($row=mysql_fetch_array($sql)){
?>
<option value="<?php echo $row["id"]?>"><?php echo $row["pername"]?></option>
<?php
}
?>
</select>
</span>
</div><br><br>

<div class="contact-input">
<label>演出分类</label><br>
<div class="fields">
<span class="dk_wrap">
<select name="codetype" class="nojs" tabindex="1">
<option value="<?php echo $codetype?>"><?php echo $codetype?></option>
</select>
</span>
</div>
</div><br><br>

<div class="contact-input">
<label>演出时间</label><br>
<span class="dk_wrap">
<div id="txtHintDate">时间根据演出</div>
</span>
</div><br><br>

<div class="contact-input">
<label>演出地点</label><br>
<span class="dk_wrap">
<div id="txtHintPlace">地点根据演出</div>
</span>
</div><br><br>

<div class="contact-input">
<label>票价</label><br>
<span class="dk_wrap">
<div id="txtHintPrice">票价根据演出</div>
</span>
</div><br><br>

selectdate.js 代码：
var xmlHttp

function showDate(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="getdate.php"
url=url+"?id="+str
url=url+"&y="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHintDate").innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}

selectprice.js代码：
var xmlHttp

function showPrice(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="getprice.php"
url=url+"?id="+str
url=url+"&z="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHintPrice").innerHTML=xmlHttp.responseText;
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}

我看了http://blog.csdn.net/liruxing1715/article/details/7162098这篇文章，但还是不行啊，
把xmlHttp变成局部变量，然后用完delete xmlHttp; xmlHttp = null;也不行。。。
在此向各位求助，谢谢了！

...全文

698 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

单单P 2015-02-26

打赏
举报

selectget.js代码： function showDate(str) { var xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="getdate.php" url=url+"?id="+str url=url+"&x="+Math.random() xmlHttp.onreadystatechange=stateChanged1 xmlHttp.open("GET",url,true) xmlHttp.send(null) } function stateChanged1() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("txtHintDate").innerHTML=xmlHttp.responseText; } } function showPlace(str) { var xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="getplace.php" url=url+"?id="+str url=url+"&x="+Math.random() xmlHttp.onreadystatechange=stateChanged2 xmlHttp.open("GET",url,true) xmlHttp.send(null) } function stateChanged2() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("txtHintPlace").innerHTML=xmlHttp.responseText; } } function showPrice(str) { var xmlHttp=GetXmlHttpObject() if (xmlHttp==null) { alert ("Browser does not support HTTP Request") return } var url="getprice.php" url=url+"?id="+str url=url+"&x="+Math.random() xmlHttp.onreadystatechange=stateChanged3 xmlHttp.open("GET",url,true) xmlHttp.send(null) } function stateChanged3() { if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById("txtHintPrice").innerHTML=xmlHttp.responseText; } } function GetXmlHttpObject() { var xmlHttp=null; try { // Firefox, Opera 8.0+, Safari xmlHttp=new XMLHttpRequest(); } catch (e) { //Internet Explorer try { xmlHttp=new ActiveXObject("Msxml2.xmlHttp"); } catch (e) { xmlHttp=new ActiveXObject("Microsoft.XMLHTTP"); } } return xmlHttp; } 版主大人，以上代码还是不行啊，三个下拉框都没内容。。。

李明文 2015-02-26

打赏
举报

Go 旅城通票 2015-02-26

打赏
举报

xhr对象重用需要注意的问题：http://bbs.csdn.net/topics/310131364

Go 旅城通票 2015-02-26

打赏
举报

你的状态转换函数都重名了啊，导致最后一个导入的js的stateChanged 这个函数生效。。 stateChanged 函数名起唯一来，然后xhr变量申明为内部变量，要不重用同一个变量结果会被覆盖的（IE）修改selectdate.js 代码： var xmlHttp function showDate(str) { var xmlHttp=GetXmlHttpObject()//////变为内部变量 //.....原来的代码 xmlHttp.onreadystatechange=stateChanged1 xmlHttp.open("GET",url,true) xmlHttp.send(null) } function stateChanged1() { //原来的代码 function showPrice(str) { var xmlHttp=GetXmlHttpObject()

单单P 2015-02-26