ajax實現WEB頁面上多任務同時作業_任務

來源:互聯網
上載者:User

 

今天需要寫一個功能,對於資料庫中的資料,在使用者通過WEB顯示出來的時候,自動啟動伺服器端指令碼對每個資料的有效性進行檢測,並將結果呈現給使用者。

 

我考慮的就是,呈現每條資料的時候,啟動一個ajax通訊進程,將結果反饋回來就OK了。

細節方面需要考慮的是,每個進程完成任務後在回調的時候如何知道它的“宿主”資料是哪一個(哪條資料發起的任務)。

 

還有由於XMLHttpRequest對於每個任務都是私人的,我們需要多任務並發,所以這裡我使用一個類封裝整個任務。每次啟動一個類對象,將其作為類的私人成員。

 

下面看看我們的用戶端指令碼模型

 

//檢測URL的ajax進程類 function TaskAjaxProcess() { //類成員XMLHttpRequest var http_request_check_url = false; //啟動任務 this.start_task = function( $obj ) { var checkurl = $obj.alt; ////////////建立http request////////////////// http_request_check_url=false; //開始初始化XMLHttpRequest對象 if(window.XMLHttpRequest)//Mozilla瀏覽器 { http_request_check_url=new XMLHttpRequest(); if(http_request_check_url.overrideMimeType) {//設定MIME類別 http_request_check_url.overrideMimeType("text/xml"); } } else if(window.ActiveXObject)//IE瀏覽器 { try { http_request_check_url=new ActiveXObject("Msxml2.XMLHttp"); } catch(e) { try { http_request_check_url=new ActiveXobject("Microsoft.XMLHttp"); } catch(e){} } } //異常,建立對象執行個體失敗 if(!http_request_check_url) { document.getElementById("searchresult").innerHTML="<font color=red>Fault error:建立XMLHttp對象失敗。</font>"; return false; } //在URL添加隨機數防止瀏覽器cache頁面 //將發起者(任務宿主)ID也傳進PHP指令碼 var post_url= "checkURL.php?url=" + checkurl + "&id=" + $obj.id + "&random=" + Math.random()*(10000); http_request_check_url.onreadystatechange=this.showCheckURLResult;//註冊完成的回呼函數 http_request_check_url.open("GET",post_url,true); http_request_check_url.send(null); } //完成的回呼函數 this.showCheckURLResult = function() { if(http_request_check_url.readyState==4) { if(http_request_check_url.status==200)//資訊返回成功 { var response = eval( "(" + http_request_check_url.responseText + ")" ); //在這裡處理結果 //將ID回傳過來,則是任務宿主類 } } }//function } //啟動任務,傳進來HTML對象 function start_task($obj) { //啟動任務 var s = new TaskAjaxProcess(); s.start_task( $obj ); }

 

服務端指令碼略,大致為處理後附帶的將任務發起者的ID也傳回來。

就可以實現同時啟動多任務並且回調後在介面上處理了。

相關文章

Alibaba Cloud 10 Year Anniversary

With You, We are Shaping a Digital World, 2009-2019

Learn more >

Apsara Conference 2019

The Rise of Data Intelligence, September 25th - 27th, Hangzhou, China

Learn more >

Alibaba Cloud Free Trial

Learn and experience the power of Alibaba Cloud with a free trial worth $300-1200 USD

Learn more >

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。