Javascript：ResponseText值越來越混淆？

我打電話給2個JS函數（Ajax），每個函數都從服務器返回數據。但第二個函數獲取第一個函數的responsetext。我看到的一件事是，如果在使用它（打印圖像和顯示錨點）之前，我在函數中使用了一個或多個警報（知道數據是什麼），它可以正常工作 - 給定了一點延遲（我猜）它的工作正常，沒有它失敗。Javascript：ResponseText值越來越混淆？

我覺得這很奇怪，一旦我做了一些搜索發現這篇文章（http://forums.devnetwork.net/viewtopic.php?f=13&t=117523），他有一個解決方法 - 給1或0.5秒的超時和事情將是正確的。

雖然解決方法似乎能夠完成工作，但我很好奇爲什麼響應文本正在從之前的Ajax中獲取值。

我知道代碼是不是necessary.but，以防萬一 - 其下方

GIST給出：

1.警報包括當 - 的代碼工作正常

2。當警報被刪除時，錨點正在顯示，但不是圖像是檢查圖像信息時被壓碎的圖像（撕碎的紙張圖像的類別），我發現數據形成了前一個功能 - 因此未被顯示。

<style type="text/css"> 
.image{ 
position: relative; 
left: 20%; 
} 
</style> 

<script type="text/javascript" > 
function create(){ 
alert("createUid"); // 1st alert with which the code works 
xmlhttp=new XMLHttpRequest(); 
xmlhttp.onreadystatechange=function(){ 
    if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
    var json = eval(xmlhttp.responseText); 
    for(i=0;i<json.length;i++){  
     var a = document.createElement("a"); //creates a List of anchors 
     a.id="a"+json[i].uid; 
     a.style.display="block"; 
     a.setAttribute("href","#"); 
     a.setAttribute("onclick","alert("+json[i].uid+")"); 
     a.appendChild(document.createTextNode(json[i].uid)); 
     document.getElementById("tag").appendChild(a); 
     } 
    } 
} 
xmlhttp.open("GET","users.php?send=vivek",true); 
xmlhttp.send("NULL"); 

} 
function display(){ 
alert("pict"); 
xmlhttp=new XMLHttpRequest(); 
xmlhttp.onreadystatechange=function(){ 
    if (xmlhttp.readyState==4 && xmlhttp.status==200){ 
     var img = document.createElement("img"); 
     img.id="dispPict"; 
     img.class="image"; 
     img.setAttribute("alt","ViperRules!!");    
     img.setAttribute("src","data:image/jpg;base64,"+xmlhttp.responseText); // response text is a binary of an image stored in the DB. 
     img.style.display="block"; 
     document.body.appendChild(img); 
     //document.getElementById("Tag").appendChild(img); 
     } 
    } 
xmlhttp.open("GET","users.php?pict=vivek",true); 
xmlhttp.send("NULL"); 
} 
</script> 

<body onload=" display(), create();"> 
<div id="tag" class="image"> </div> 
</body>

來源

2011-08-07 Vivek Chandra

您在每個函數中使用全局變量xmlhttp - 意味着每個函數都使用相同的xmlhttp。第二個函數調用替換第一個函數的xmlhttp onreadystatechange，所以當第一個調用返回時，它執行第二個onreadystatechange。

要解決此問題，您不需要使用全局變量。這可以通過在定義變量前加上var來完成。

實施例：

<script type="text/javascript" > 
function create(){ 
    alert("createUid"); // 1st alert with which the code works 
    var xmlhttp=new XMLHttpRequest(); 
    ... 
} 

function display(){ 
    alert("pict"); 
    var xmlhttp=new XMLHttpRequest(); 
    ... 
} 
</script>

來源

2011-08-07 20:37:08 janiv

@ Janiv：不知道xmlhttp是一個全局變量，明白我出錯的地方。謝謝。 –

@Vivek：這不是xmlhttp是JavaScript中的一個預定義的全局變量，只是它在第一次使用時將var留在了它的前面而成爲了全局變量。 – janiv

哦..我會記住的。 –

全局屬性被使用 - xmlhttp。因此，回調裏面的xmlhttp是而不是在關閉中綁定，而是全局屬性是覆蓋第二次調用create()。（超時/延遲允許第一XHR請求來實際光潔度第一）

最簡單的「修復」是改變：

xmlhttp=new XMLHttpRequest();

到：

var xmlhttp=new XMLHttpRequest();

這將聲明xmlhttp作爲函數局部變量，因此它將在回調中關閉。然而，我會推薦使用一個框架 - jQuery非常流行 - 使整個過程更簡單。

快樂編碼。

來源

2011-08-07 20:38:17

謝謝。收穫！ –

Javascript：ResponseText值越來越混淆？

回答

相關問題