處理多個XMLHttpRequest調用f

Question

注意：我有兩個xmlHttp.open請求，它們具有兩個不同的url字符串和兩個定義的onreadystatechange函數。我有一個有4個文本框和一個提交按鈕的html表單。在用戶輸入數據到文本框1（id）& 2（type）後，我的onchange函數爲這些框發出一個xmlHttp.open（「GET」，url，true）;帶有類似「getQuestion.php？id = 12345 & type = ABC」的網址。然後我的statechange函數接受返回的xml響應，並將響應放入第三個文本框中。所有這些都很棒！我輸入文字和文字彈出一個框問我一個問題。

現在我試圖做的是一旦第四個文本框被填寫並點擊提交按鈕，我想提交函數再次使用xmlHttp.open。這一次，有一個新的url，在&的url行上增加了一個參數answer =「XXXX」，其中XXXX是輸入到第4個框中的內容。這是第二次調用url，因爲調用了新的statechange函數。但答覆總是空的，我看到「答案是。」。我認爲這必須與多個url，我沒有正確設置，但我無法從我的網頁搜索「多個xmlHttpRequest」中找到任何東西。我附加了我的HTML和啓動失敗服務器請求的java代碼塊，它是statechange函數。我究竟做錯了什麼？ 還有一件事，如果我直接調用我的第二個URL（PHP腳本）的參數，我得到我期望的迴應。

<script language="Javascript"> 
/* Create a new XMLHttpRequest object to talk to the Web server */ 
var xmlHttp = false; 
var attempts = 0; 
try { 
    xmlHttp = new ActiveXObject("Msxml2.XMLHTTP"); 
} catch (e) { 
    try { 
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } catch (e2) { 
    xmlHttp = false; 
    } 
} 
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') { 
    xmlHttp = new XMLHttpRequest(); 
} 

function CheckAnswer() { 
    var myId = document.getElementById("FilerID").value; 
    var myType = document.getElementById("FilerType").value; 
    var myQuestion = document.getElementById("QuestionID").value; 
    var myAnswer = document.getElementById("AnswerID").value; 

    if (myId == "" || myType == "" || myQuestion == "" || myAnswer == "") 
    { 
     alert("You must fill in all boxes before submitting this request."); 
     return; 
    } 

    // Build the URL to connect to 
    var url = "getAnswer.php?id=" + encodeURI(myId) + "&type=" + encodeURI(myType) + "&answer=" + encodeURI(myAnswer); 

    // Open a connection to the server 
    xmlHttp.open("GET", url, true); 
    xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); 
    // Setup a function for the server to run when it's done 
    xmlHttp.onreadystatechange = AnswerState; 

    // Send the request 
    xmlHttp.send(null); 
} 

function AnswerState() { 
    if (xmlHttp.readyState == 4) { 
    var response2 = xmlHttp.responseText; 
     alert("answer was " + response2+"."); 
     switch (response2) 
    { 
     case "pdwLIMBO": 
      alert("There was an error while trying to reset your password."); 
      break; 
     case "pdwFALSE": 
      alert("Answer was incorrect."); 
      attempts = attempts +1; 
      if (attempts == 3) 
      { 
       /*is there a way to kill it right now?*/ 
      } 
      else 
       document.getElementById("AnswerID").focus(); 
      break; 
     case "pdwTRUE": 
      alert("answer was " + response); 
      alert("Your new password will be emailed to you. Please check your email."); 
      break; 
     default: 
      alert("nothing!"); 
      break; 
    } 

    } 
} 
<table width="98%" border="0" align="center" height="280" background="/images/DSCF0308_B.gif"> 
<tr> 
<td align="center"> 
<h2 align="center" class="style26">Reset Service</h2> 
<!--<form name="resetMe" action="SecretQuestion3.php" method="post" onsubmit="return CheckInput();">--> 
<form > 
    <TABLE cellspacing=0 cellpadding=5 border=0 width="90%"> <!---this color is light blue in sign in box---> 
     <tr id="FilerIDRow"> 
     <TD align="right" class="RptStd"><b>Filer ID:</b></TD> 
     <TD align="left" class="RptStd"> <input type="text" id="FilerID" name="FilerID" nowrap size=8/ onChange="callForQuestion();"></td> 
    </tr> 
    <tr > 
    <TD align="right" class="RptStd" ><b>Filer Type: </b></TD> 
    <TD align="left" class="RptStd"> 
     <select name="FilerType" id="FilerType" onChange="callForQuestion();"> 
     <option value="COH">COH: Candidate/Officeholder (Non-Judicial)</option> 
     <option value="JCOH">JCOH: Judicial Candidate/Officeholder </option> 
     </select></TD> 
    </tr> 
    <tr id="QuestionRow"> 
    <TD align="right" class="RptStd"><b>Secret Question:</b></TD> 
    <TD align="left" class="RptStd"> <input type="text" id="QuestionID" name="QuestionID" nowrap size="50"></td> 
    </tr> 
    <tr id="AnswerRow"> 
    <TD align="right" class="RptStd"><b>Your Answer:</b></TD> 
    <TD align="left" class="RptStd"> <input type="text" id="AnswerID" name="AnswerID" nowrap size="50" onChange="checkAnswer();"></td> 
    </tr> 
    <TR> 
    <TD align="center" colSpan=2><br><INPUT type="button" value=" Reset " name="btn_submit" class="RptBtn" onClick="CheckAnswer()">&nbsp;&nbsp; 
    <INPUT type="button" value=" Clear " name="btn_clear" class="RptBtn" onClick="ClearForm()"></TD> 
    </TR> 
</table> 
</form> 
</td> 
</tr> 
</table> 

Answer 1

嘗試改變：

if (!xmlHttp && typeof XMLHttpRequest != 'undefined') { 
    xmlHttp = new XMLHttpRequest(); 
} 

到：

if (!xmlHttp && typeof XMLHttpRequest != 'undefined') { 
    var xmlHttp = new XMLHttpRequest(); 
} 

我也有類似的問題，this link幫我

Answer 2

+1什麼雅各布托拜厄斯以上引用羅布建議W的解決方案。我重申，雅各布被鏈接/參考太羅布W公司推薦：

定義XMLHTTP使用VAR像這樣：

改變了...

XMLHTTP =新的XMLHttpRequest（）;

這樣：

變種XMLHTTP =新的XMLHttpRequest（）;

Rob W的解釋：目前，您將xmlHttp指定爲全局變量。因此，只能有一個名爲xmlHttp的變量...

如果在變量前面使用var，則該變量在本地範圍內定義，允許您使用多次重新定義變量。