注: 2 つの異なる URL 文字列と 2 つの onreadystatechange 関数が定義された 2 つの xmlHttp.open 要求があります。4 つのテキスト ボックスと送信ボタンがある html フォームがあります。ユーザーがテキスト ボックス 1(id) と 2(type) にデータを入力すると、これらのボックスの onchange 関数が xmlHttp.open("GET", url, true); を発行します。「getQuestion.php?id=12345&type=ABC」のような URL を使用します。次に、statechange 関数は、返された xml 応答を受け取り、その応答を 3 番目のテキスト ボックスに入れます。これはすべてうまくいきます！テキストを入力すると、ボックスにテキストがポップアップ表示され、質問が表示されます。
ここで私がやろうとしたのは、4 番目のテキスト ボックスが入力され、送信ボタンがクリックされたら、送信機能で xmlHttp.open を再度使用することでした。今回は、新しい URL があり、&answer="XXXX" の URL 行にもう 1 つのパラメータがあります。XXXX は 4 番目のボックスに入力されたものです。この 2 番目の URL 呼び出しは、新しい statechange 関数が呼び出されるために行われます。しかし、応答は常に null で、"answer was ." と表示されます。これは、適切に設定していない複数の URL を持つことと関係があるに違いないと考えていますが、「複数の xmlHttpRequest」での Web 検索からは何も見つかりません。HTML と、失敗したサーバー要求を開始する Javacode ブロックを添付しました。これは statechange 関数です。私は何を間違っていますか？もう一つ、
<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()">
<INPUT type="button" value=" Clear " name="btn_clear" class="RptBtn" onClick="ClearForm()"></TD>
</TR>
</table>
</form>
</td>
</tr>
</table>