請教AJAX參數接收問題2

Rank: 9 Rank: 9 Rank: 9

帖子: 763
主題: 210
精華: 2
積分: 232
威望: 232
金錢: 0

2^#

發表於 2009-3-31 22:39 | 只看該作者

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

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

To infinity and beyond!

Rank: 1

帖子: 43
主題: 4
精華: 0
積分: 5
威望: 5
金錢: 0

3^#

發表於 2009-4-1 11:11 | 只看該作者

是的就誠如您所說
真的只有最後一筆資料真的有被載入的動作並出現在頁面上
而不是我當初所想的那樣~可以不同的資料一序排列整齊並安置在不一樣的位置上
我再繼續試試看好了
有問題再向您請教

邁向神乎其技的境界^^

Rank: 1

帖子: 43
主題: 4
精華: 0
積分: 5
威望: 5
金錢: 0

4^#

發表於 2009-4-2 21:37 | 只看該作者

您好
我後來有想了一個辦法就是在function裡面再次呼叫function來達到遞迴功效--藉此讓數值發生改變(+1)--因此沒使用for迴圈(您建議的Jquery我知道--但不是太熟--請見諒--若真的不行我再改用jquery試試看)
但出來的效果只有第一筆資料正確的被感應出來且資料正確
第一筆之後的資料因為不知名的原因沒被正確感應--自然而就沒有值出來
想請您幫我看看我這樣的邏輯跟寫法通不通順或是合理(一樣在FF的錯誤控制台裡--沒有任何錯誤訊息)
1=初始值=num10(隨著每個round之後每加1)
8=終止值=num11
其它資料相關屬性確定是正確的

<body onLoad="ajaxloop(1,8);">

<script language="javascript">
function ajaxloop(num10,num11)
{
var requestString="order_input_querybau1.php?colorid="+document.getElementById('color'+num10).value;
xmlHttp.open('GET',requestString,true);

xmlHttp.onreadystatechange = function()
{
catchGetTimeajax(num10,num11);
};

xmlHttp.send(null);
}

function catchGetTimeajax(num10,num11)
{

if (xmlHttp.readyState==4 || xmlHttp.readyState=='complete')
{

  if (xmlHttp.status == 200)
  {
  var result = xmlHttp.responseText;

if (num10=1)//第一個round時的設定開始
{
document.getElementById('idbau'+num10).innerHTML=result;

xmlHttp.onreadystatechange = function()
{
num10=num10+1;//預先設定第二個round的一開始的初始值
ajaxloop(num10,num11);//預先設定第二個round的新參數設定--並再次重複呼叫ajaxloop
};

}//第一個round時的設定結束(num10應該要在第一個round之後被加了1)

if (num10>1 && num10<=num11)//第二個round之後時的設定開始(num10這時應該是已經變成大於1的數字)
{
document.getElementById('idbau'+num10).innerHTML=result;

xmlHttp.onreadystatechange = function()
{
num10=num10+1;//預先設定包含第n個round之後的一開始的初始值
ajaxloop(num10,num11);//預先設定包含第n個round之後的新參數設定--並再次重複呼叫ajaxloop
};

}//第二個round之後時的設定結束

  }

}

}
</script>
</body>

[ 本帖最後由 bau720123 於 2009-4-2 22:16 編輯 ]

邁向神乎其技的境界^^

wmh

Rank: 9 Rank: 9 Rank: 9

帖子: 763
主題: 210
精華: 2
積分: 232
威望: 232
金錢: 0

5^#

發表於 2009-4-2 23:41 | 只看該作者

其實你的問題出在呼叫的方式，而非 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!

Rank: 1

帖子: 43
主題: 4
精華: 0
積分: 5
威望: 5
金錢: 0

6^#

發表於 2009-4-3 00:37 | 只看該作者

不好意思
我剛看了一下您的1~16行~好像跟我第一次寫的3~19行是一樣的吧
怎麼好像跟我第一次的CODE一模一樣耶
還是您直接有編輯我第一次的文章呢??
我看不出來有差在哪裡耶
我資質魯鈍
望您別生氣^^感謝

[ 本帖最後由 bau720123 於 2009-4-3 00:39 編輯 ]

邁向神乎其技的境界^^

wmh

Rank: 9 Rank: 9 Rank: 9

帖子: 763
主題: 210
精華: 2
積分: 232
威望: 232
金錢: 0

7^#

發表於 2009-4-3 07:48 | 只看該作者

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

等 request 送出後才做下一次的 request

To infinity and beyond!

Rank: 1

帖子: 43
主題: 4
精華: 0
積分: 5
威望: 5
金錢: 0

8^#

發表於 2009-4-3 11:59 | 只看該作者

謝謝您的說明
但我改了之後在FF有出現一個錯誤(改之前也是同一個錯誤)(沒跟您報告是我的錯~請見諒)
錯誤訊息為(代表i的值可能沒有正確傳遞--但i最其碼應該要先run過一次1說^^|||)
document.getElementById('idbau'+i) is null

若我把程式碼
document.getElementById('idbau'+i).innerHTML=result;

暫時寫死~不要動態載入因此變成(先讓它無論如何出現在第一個位置)
document.getElementById('idbau1').innerHTML=result;

結果第一個位置的資料有出來了
但出來的資料就跟以前一樣..出現的是for迴圈中的最後一筆資料(也就是第8筆)
ㄚ_ㄚ

[ 本帖最後由 bau720123 於 2009-4-3 12:00 編輯 ]

邁向神乎其技的境界^^

wmh

Rank: 9 Rank: 9 Rank: 9

帖子: 763
主題: 210
精華: 2
積分: 232
威望: 232
金錢: 0

9^#

發表於 2009-4-3 12:39 | 只看該作者

原因在於你這樣的迴圈會帶入不正確的 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!

Rank: 1

帖子: 43
主題: 4
精華: 0
積分: 5
威望: 5
金錢: 0

10^#

發表於 2009-4-3 14:45 | 只看該作者

您好謝謝您的回覆
在照您改的方式改完之後
果然FF一點錯誤訊息都沒有了
但出來的資料卻還是只能在頁面上正確的顯示最後一筆而已(且資料正確)
(因此表示迴圈的確是有跑過的--只是尚不知道為何有效的都只有最後一筆而已)
另外有一件事想請教您
長久下來我覺得你是個很有禮貌也很有責任的版主兼站長
請問網站本身有沒有需要補助或是其它需要幫忙的呢
如果我能力範圍內定當幫忙
純誠心的請問你啦~千萬別誤會唷

完整程式碼如下

<body onLoad="ajaxloop(8);">

<script language="javascript">
var xmlHttp;
function createXHR()
{

 if (window.XMLHttpRequest) 
 {
 xmlHttp = new XMLHttpRequest();
 }
 
  else if (window.ActiveXObject) 
  {
  xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
  }

   if (!xmlHttp) 
   {
   alert('您使用的瀏覽器不支援 XMLHTTP 物件');
   return false;
   }
   
}

function ajaxloop(num10)
{
createXHR();
 
 for (i=1;i<=num10;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;
 xmlHttp.open('GET',requestString,true);

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

}

function catchGetTimeajax(unique_i)
{
 
 if (xmlHttp.readyState==4 || xmlHttp.readyState=='complete')
 {
 
  if (xmlHttp.status == 200) 
  {
  var result = xmlHttp.responseText;
  document.getElementById('idbau'+unique_i).innerHTML=result;
  }
 
 }

}
</script>

</body>

[ 本帖最後由 bau720123 於 2009-4-3 15:19 編輯 ]

邁向神乎其技的境界^^