返回列表 發帖
你的迴圈應該是有錯,你用同一個 xmlHttp 在短時間內做多次 request ,應該只有最後一次的 request 會有成功送出,你可以透過 server 端的 log 來看就可以看出。如果要送多組資料,建議一次將資料組好再送出。

此外也可以試試看用一些 JavaScript Library 來做 HTTP Request,例如用 jQuery 使用上就很方便,如果你要同時做多次的 request,jQuery 就可以幫你避免掉這種錯誤的邏輯問題。
To infinity and beyond!

TOP

其實你的問題出在呼叫的方式,而非 callback 的寫法。

我直接改你第一次的 code 你就會知道差在哪裡了:
function ajaxloop(num10)
{
 
 for (i=1;i<=num10;i++)
 {
  var requestString="order_input_querybau1.php?colorid="+document.getElementById('color'+i).value;
  xmlHttp.open('GET',requestString,true);

  xmlHttp.onreadystatechange = function()
  {
   catchGetTimeajax(i);
  };

  xmlHttp.send(null);
 }
}
To infinity and beyond!

TOP

差在這一行的位置喔:
xmlHttp.send(null);

等 request 送出後才做下一次的 request
To infinity and beyond!

TOP

原因在於你這樣的迴圈會帶入不正確的 i 值,程式是可以改為這樣:
function ajaxloop(num10)
{

 for (i=1;i<=num10;i++)
 {
  var requestString="order_input_querybau1.php?colorid="+document.getElementById('color'+i).value;
  xmlHttp.open('GET',requestString,true);

  (function() {
    var unique_i = i;
    xmlHttp.onreadystatechange = function()
    {
     catchGetTimeajax(unique_i);
    };
  })();

  xmlHttp.send(null);
 }
}
但是我覺得這樣不是好的方式,原因在於之前提過的,如果不是必要的話,不應該連續送出多次的 request。你可以把資料都收集完成後,做一次 request 應該是比較好的作法。
To infinity and beyond!

TOP

嗯,我建議你還是用不同的 xmlHttp 物件來發出 request 好了,短時間內使用同一個 xmlHttp 物件去發出 request 似乎只有最後一次會成功。你先試試看,如果寫不出來再提出來討論看看。

另外也感謝你的支持,目前這個小站並沒有需要特別的協助,如果你不嫌棄,歡迎多多參與討論囉,不論是發問或是分享都非常歡迎。
To infinity and beyond!

TOP

呵呵,複雜的 Web Application 可能真的會同時發出很多個 Request,不過和你目前的狀況不太一樣。你應該只需要使用不同的  xmlHttp 物件就可以解決了。如果你覺得有困難的話,我可以教你用 jQuery 的方式,保證你可以感受到使用函式庫的威力
To infinity and beyond!

TOP

哇勒,我沒有要收學費啦。我只是看你好像想要自己嘗試,所以之前只有點到為止。

看看改用 jQuery 的程式吧:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {

  for (i=1; i <= 8; i++) {
    var requestString="order_input_querybau1.php?colorid="+document.getElementById('color'+i).value+"&styleid="+document.getElementById(  'style'+i).value+"&level="+i+"&id="+document.getElementById('id'+i).value;

    (function() {
      var unique_i = i;
      var callback = function(data, textStatus) {
        $('#idbau' + unique_i).html(data);
      };
      $.get(requestString, {}, callback, 'text');
    })();
  }

});
</script>
首先第 1 行是直接讀 Google 網站上所提供的 jQuery,如果你自己伺服器上面有 jQuery,也可以改用自己的。

第 3 行開始是 jQuery 所提供的功能,放這邊的程式都會在整份網頁下載完成後才開始執行,類似你原本放 body onload 的語法。

第 5 行我直接把迴圈數量寫固定的值。

第 8 行用到了 JavaScript 的 closure,因為你要在每次 request 後處理特定的元素,因此我把那個 unique_i 又包到這裡面來,包括了那個 callback,都會變成是獨一無二的。

第 13 行是 jQuery 用來做 GET request 的函數,很簡潔,也不用管 xmlHttp 的初始化,jQuery 都會幫你搞定,你只要傳入正確參數即可。詳見:http://docs.jquery.com/Ajax/jQuery.get#urldatacallbacktype

這樣應該就可以正常運作了。
To infinity and beyond!

TOP

用 jQuery 的話,可以透過 callback 的第二個參數來判斷狀態,或是直接在 callback 內使用 this 來取得 HTTPRequest 的物件。
function (data, textStatus) {
  // data could be xmlDoc, jsonObj, html, text, etc...
  this; // the options for this ajax request
  // textStatus can be one of:
  //   "timeout"
  //   "error"
  //   "notmodified"
  //   "success"
  //   "parsererror" 
  // NOTE: Apparently, only "success" is returned when you make
  // an Ajax call in this way. Other errors silently fail.
  // See above note about using $.ajax.
}
To infinity and beyond!

TOP

返回列表 回復 發帖