ajax調用在IE11和chrome中不能正常工作

計劃很簡單，javascript向文件'localhost/test/php/test.php？a ='發送ajax GET請求。 test.php文件簡單迴響$ _GET ['a']回來。然後將Ajax響應用作某些div的innerHTML。ajax調用在IE11和chrome中不能正常工作

這美麗workfs如預期的Firefox，但在Chrome和IE11它只是加載在循環的最後一次迭代的頁面：

HTML

<!DOCTYPE html> 
<html> 
    <head> 
     <meta http-equiv='Content-Type' content='Type=text/html; charset=utf-8'> 
     <meta charset="UTF-8"> 
     <link rel="stylesheet" href="css/style.css" /> 
    </head> 
    <body> 
     Text will appear here: 
     <div></div> 
     <script src="js/script.js"></script> 
    </body> 
</html>

的Javascript

window.onload = function() { 
    test.init(); 
}; 

var test = { 
    init: function() { 
     var ajax = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); 
     for (var a = 0 ; a < 100 ; a++) { 
      ajax.open('GET','php/test.php?a='+a,false); 
      ajax.send(); 
      ajax.onreadystatechange = function() { 
       if (this.status == 200 && this.readyState == 4) { 
        var div = document.getElementsByTagName('div'); 
        div[0].innerHTML = ajax.responseText; 
       } 
      }; 
     } 
    } 
};

PHP

<?php 
$a = $_GET['a']; 

echo $a; 
?>

我需要更改哪些內容才能在IE和Chrome上完成這項工作？

來源

2015-02-07 brunobliss

將回調中ajax爲最後創建的XHR，而不是此回覆所引用的XHR。我不認爲您可以對多個未完成的請求使用相同的「XMLHttpRequest」對象。您需要每次循環制作新的XHR。 – Barmar 2015-02-07 01:19:12

我幾年沒見過手卷AJAX電話了！ – 2015-02-07 01:19:28

只是將ajax var放入循環中，但仍然沒有處理，事實上，現在它甚至不顯示ajax響應。 @LG_PDX由於某種原因，我只是不喜歡jQuery :) – brunobliss 2015-02-07 01:22:17

您應該每次在循環中創建一個新的XHR，而不是重複使用同一個XHR。

var test = { 
    init: function() { 

     for (var a = 0 ; a < 100 ; a++) { 
      var ajax = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP"); 
      ajax.open('GET','php/test.php?a='+a,false); 
      ajax.send(); 
      ajax.onreadystatechange = function() { 
       if (this.status == 200 && this.readyState == 4) { 
        var div = document.getElementsByTagName('div'); 
        div[0].innerHTML = this.responseText; 
       } 
      }; 
     } 
    } 
};

請注意，我也改變ajax.responseText到this.responseText。在回調中，由於Javascript infamous Loop issue?

來源

2015-02-07 01:22:27 Barmar

好吧！這對CHROME（IE11仍然是壞掉的...... *嘆息*）的竅門，但我也刪除了在Ajax調用中的錯誤。我想我必須等待請求完成才能看到數字發生變化，恰恰相反，這完全是另一種方式：D – brunobliss 2015-02-07 01:28:58

ajax調用在IE11和chrome中不能正常工作

回答

相關問題