Ajax

AJAX -示例

AJAX -示例

AJAX在一些流行的web應用程序中使用。一些例子包括:

  • 自動完成

穀歌是第一批將AJAX用於自動向用戶提供建議的網站之一。當您在穀歌中輸入搜索查詢時,您將注意到一些建議將自動出現,您可以通過上下鍵導航在這些建議中進行選擇。

在這裏,它使用AJAX顯示基於每次擊鍵輸入的結果。在填寫表單或啟動查詢時,自動完成功能可以讓用戶輕鬆地處理大量輸入。

https://www.google.com/

投票

像Reddit這樣的網站使用AJAX對網站上顯示的主要內容進行投票和評級。用戶可以在短時間內對幾個故事投票並發表意見。

http://www.reddit.com/

即時消息

AJAX的應用程序還可以在聊天室中享受無縫的即時消息傳遞功能。AJAX處理的兩個主要過程包括:向服務器發送和從服務器接收消息以進行實時更新。在後台,每當用戶發送或接收消息時,AJAX都會重新加載頁麵。

更新用戶內容

Twitter最近使用AJAX來增強其平台和界麵。每當一個新的話題開始流行或用戶的推文,這些立即更新,而不需要重新加載整個頁麵。Twitter feed每隔一秒加載一次,讓用戶了解實時更新、熱門話題、tweet活動等等。

http://www.twitter.com/

登錄表單

在用戶希望訪問某個頁麵並可以直接登錄而無需轉到原始登錄頁麵的情況下,AJAX有助於更新登錄係統。當用戶登錄時,AJAX將向服務器發送一個請求,頁麵將根據用戶的要求進行更新。

http://www.digg.com/

外部部件

AJAX在各種內容管理係統中也有應用,比如WordPress和穀歌Adsense。AJAX可以與任何在線服務器通信,而不僅僅是web頁麵所在的服務器。它加載網頁上的外部內容,而網頁上的原始內容保持不變。

http://www.adsense.com/

地圖

穀歌Maps和Yahoo Maps使用AJAX來簡化用戶的導航過程。用戶可以簡單地拖動地圖,而不需要單擊按鈕。

AJAX -瀏覽器支持

AJAX支持的瀏覽器數量有限,其中一些包括-

  • Mozilla Firefox 1.0及以上版本
  • Konqueror
  • Opera 7.6及以上版本
  • 微軟Internet Explorer 5及以上版本
  • 蘋果Safari 1.2及以上版本
  • netscape7.1及以上版本

AJAX不支持所有瀏覽器的原因是,不同的瀏覽器使用不同的方法來創建內置JavaScript對象,即XMLHttpRequest。

因此,在編寫web應用程序之前,建議檢查您的瀏覽器是否支持AJAX。但是,創建JavaScript對象的一種方法是使用try....catch塊。

下麵是使用' try.... '的瀏覽器兼容代碼catch '塊來創建XMLHttpRequest對象。

   
name:
Time:
Baidu

在上麵的例子中,我們創建了ajaxRequest變量。這用於創建對象,ajaxRequest=new XMLHttpRequest()這是為不兼容的瀏覽器,如Firefox, Opera和Safari完成的。如果這個方法失敗了,那麼我們還剩下兩個方法。

第二次,我們使用ajaxRequest=new ActiveXObject("Msxml2.XMLHTTP"),它用於為Internet Explorer 6.0及以上瀏覽器創建對象。現在,如果這次也失敗了,再試第三次。

在第三種方法中,我們使用ajaxRequest=new ActiveXObject("Microsoft.XMLHTTP"),它用於Internet Explorer 5.5+瀏覽器。

如果上述方法都不起作用,則用戶使用的是過時的瀏覽器,很可能會收到瀏覽器與AJAX不兼容的警告。

Baidu
map