我有一个页面，它为用户动态创建（使用jQuery）输入框。然后，用户可以在他创建的每个输入框中输入值。单击保存按钮时，将调用一个 javascript 函数，该函数循环访问用户创建的所有输入框，并使用 XMLHttpRequest 将这些值发送到进程.php文件，该文件将这些值插入数据库。
如果我一次只发送一个请求，则此代码工作正常。但是，如果我循环它并在每次迭代时从每个框发送值（意味着，使用循环发送多个请求），则只有最后一个请求成功。除最后一个调用外的所有其他调用都将中止（使用 firebug 找到它）。
知道为什么会这样吗？
我的代码：
<script>
function saveTimeSlots(){
var ajaxRequest;
try{
ajaxRequest = new XMLHttpRequest();
}
catch(e){
alert('Issue with browser.')
}
ajaxRequest.onreadystatechange = function(){
if( ajaxRequest.readyState==4 ){
alert(ajaxRequest.responseText); //This returns empty except for last call
}
}
var timeSlots = document.getElementById('formSlots').childNodes;
var date = $.datepicker.formatDate('dd-mm-yy', new Date($('#datepicker').datepicker("getDate")));
for(j=0; j<timeSlots.length; ++j){
var time = timeSlots[j].getElementsByTagName("input")[0].value;
var status = 1;
var queryString = "?date=" + date + "&time=" + time + "&status=" + status;
ajaxRequest.open("GET", "process.php" + queryString, true);
ajaxRequest.send(null);
}
}
</script>
<input type="button" value="Save time slots" class="custom-button" onclick="saveTimeSlots()"/>
以下是过程代码.php
<?php
mysql_connect( $dbhost,$user,$pwd );
mysql_select_db( $dbase ) or die( mysql_error() );
$date = mysql_real_escape_string( $_GET['date'] );
$time = mysql_real_escape_string( $_GET['time'] );
$status = mysql_real_escape_string( $_GET['status'] );
$query = "INSERT INTO time_slots (`date`,`time`,`status`) VALUES ('" . $date . "','" . $time . "'," . $status . ")";
echo $query;
if( mysql_query( $query ) ){
echo "Success";
}else{
echo mysql_error();
}
mysql_close();
}
?>
这是Firebug显示的内容：
GET http://localhost/process.php?date=24-06-2012&time=1&status=1 Aborted
GET http://localhost/process.php?date=24-06-2012&time=2&status=1 Aborted
GET http://localhost/process.php?date=24-06-2012&time=3&status=1 200 OK 31ms
不能将一个 XMLHttpRequest 实例用于多个请求。为每个请求创建一个新实例。
由于您已经在使用 jQuery，我建议使用 $.ajax（或$.get）来获取请求。
function saveTimeSlots(){
$('#formSlots').children().each(function() {
var time = $(this).find('input:first').val();
var status = 1;
var queryString = "?date=" + date + "&time=" + time + "&status=" + status;
$.get("process.php" + querystring, function(responseText) {
alert(responseText);
});
});
}
您对所有请求使用相同的 XMLHttpRequest 对象，因此一旦启动请求，下一个请求就会在其上启动另一个请求，从而中止前一个请求。
为每个请求创建一个新的XMLHttpRequest对象，或者只使用 jQuery 的 ajax。拥有jQuery而不使用它是不好的。