返回列表 發帖

請教AJAX參數接收問題2

在請教版主一個問題

也是延伸前一個問題
num10確定有值~假設是8
想要達到的效果是透過迴圈的功能
間接的執行8次catchGetTimeajax裡面的內容
也就是第一次是i=1第二次會是=2.....
但以下的程式碼出現在頁面上完全沒做工~一點動靜也沒有~FF也沒有任何錯誤訊息~請問有哪裡還需要補強的呢~可能是我迴圈寫錯
(如果我所有資料都寫死是會有資料出來的~比方for 1 to 1~是會有資料的)
<body onLoad="ajaxloop(8);">

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);
}

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

}
邁向神乎其技的境界^^

用 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

那麼請問當使用Jquery時,要如何判斷status呢
問題如下:

function testHTTPReq(URL)
{
        HttpReq.onreadystatechange = getHTTPReqOK;
        HttpReq.open("POST", URL, true);
        HttpReq.send(null);
}

//傳統使用javascript 會用HttpReq.status判斷,那麼在Jquery中如何判斷呢
function getHTTPReqOK() {
        if (HttpReq.readyState === 4)
        {       
                if (HttpReq.status !== 200)
                {
                        alert("失敗")
                        return;
                }
                alert(HttpReq.responseText);
        }
}

TOP

大成功
實在是太神奇了
真是不可思議
我的確感受到它的威力
速度執行也挺快的
我定當好好研究一下
再次感恩

[ 本帖最後由 bau720123 於 2009-4-10 11:43 編輯 ]
邁向神乎其技的境界^^

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

拜託你教我
我求知若渴
我願意付學費
我沒別的意思我是真心的

其實我自己本身也是工程師啦
學習程式語言或是資料庫網頁相關也是自學起來的
接觸AJAX這塊也是說長不長說短但也是不到一年的時間
曾經看過您分享jquery的文章
用短短的程式碼就可以取代掉AJAX本來傳寫的一大卡車javascript的內容

再次謝謝你啦^^

[ 本帖最後由 bau720123 於 2009-4-6 17:35 編輯 ]
邁向神乎其技的境界^^

TOP

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

TOP

恩恩
我再持續嘗試看看好了
分享這篇文章
http://www.josephjiang.com/presentation/AJAX/what-is-ajax.html

捲軸最下方
Request 控管的問題 : 當是一個複雜的 Web Application 時,我們可能會一次發出很多個 Request,這時管理 Request 就是一個大問題、因為 AJAX 是非同步的,第一個發出的 Request 並不代表會是第一個回來的!

看來我這個問題沒那麼好解決呢~我再多多研究好了

[ 本帖最後由 bau720123 於 2009-4-6 15:36 編輯 ]
邁向神乎其技的境界^^

TOP

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

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

TOP

您好謝謝您的回覆
在照您改的方式改完之後
果然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 編輯 ]
邁向神乎其技的境界^^

TOP

返回列表 回復 發帖