當前位置:才華齋>設計>網頁設計>

關於jquery非同步載入

網頁設計 閱讀(2.74W)
關於jquery非同步載入1

本來要做一個檔案目錄瀏覽介面,需要遍歷所有的檔案和目錄,很顯然一次性讀取時很費時費力的一件事情。

關於jquery非同步載入

因此就需要做非同步載入....

準備工作:

1下載 JQuery ZTree

複製其中的JS和CSS即可,其實沒必要引那麼多,用什麼引什麼就可以。

2 需要fastJSON,用來轉換JSON物件

我下載JAR包後,引入到Eclipse中總是報找不到class錯誤。

解決辦法:把jar包放在WEB-INF/lib下即可。

程式碼例項:

<%@ page="" language="java" contenttype="text/html; charset=utf-8" pageencoding="utf-8">

關於jquery非同步載入2

AJAX 全稱 AsyncHRonous JavaScript and XML(非同步的 JavaScript 和 XML)。它並非一種新的技術,而是以下幾種原有技術的結合體。

1) 使用CSS和XHTML來表示。

2) 使用DOM模型來互動和動態顯示。

3) 使用XMLHttpRequest來和服務器進行非同步通訊。

4) 使用javascript來繫結和呼叫。

通過AJAX非同步技術,可以在客戶端指令碼與web伺服器互動資料的過程中使用XMLHttpRequest物件來完成HTTP請求(Request)/應答(Response)模型:

1) 不需要使用者等待服務端響應。在非同步派發XMLHttpRequest請求後控制權馬上就被返回到瀏覽器。介面不會出現白板,在得到伺服器響應之前還可以友好的給出一個載入提示。

2) 不需要重新載入整個頁面。為XMLHttpRequest註冊一個回撥函式,待伺服器響應到達時,觸發回撥函式,並且傳遞所需的.少量資料。“按需取資料”也降低了伺服器的壓力。

3) 不需要使用隱藏或內嵌的框架。在XHR物件之前,模擬Ajax通訊通常使用hack手段,如使用隱藏的或內嵌的框架(標籤)。

css:

#loading {width:170px;height:25px;border:3px solid #C3DAF9;position:absolute;top:300px;left:600px; z-index:10000; background-color:#F7F9FC;line-height:25px;vertical-align:middle;font-size:11pt;display:none;}

html: