彭彭的jQuery ajax 代碼。。超簡單。。

來源:互聯網
上載者:User

現在來寫ajax教材。。其實已經超級簡單了。。

以前的時候只是針對IE的時候。。還是可以寫個函數就KO了的。。但是現在各大瀏覽器林立。。弄的我們

有時候也沒有辦法。。支援IE。。支援FF。。我可是很懶的。。

既然已經有了ajax架構。。何必再自己寫一個呢。。o(∩_∩)o...

這裡我們來用jQuery的吧。。jQuery的ajax超級簡單。。一個get函數搞定!

可是很多基礎不好的傢伙。。還是有點不能理解。。沒辦法。。還是講下原理吧。。

ajax 白話 ---> 非同步傳輸。。就是不重新整理頁面獲得資料。。

那麼再白點就是,用個函數從一個檔案獲得你所需要的資料。。

這個時候就會出現了一個事件了。。啥事件尼。。那就是裝載事件啊。。你比如點擊一個按鈕。。執行一

個函數了。這個函數擷取一個檔案的資料。。而這個時候,這個資料的資料量很大,這個時候,你是不是

會等那麼一會兒啊。。比如說5秒。。那麼你擷取完資料才把資料顯示到頁面上。。這個時候就出現了咱

們的重頭演員了!! [裝載完畢事件] 也就是說,你的操作都要寫在這裡,比如把資料顯示出來啊。。什

麼的。。

說了這麼多。。其實就是為了引出 [裝載完畢事件]

其他的也就沒什麼了。。下面看看實際上的代碼是如何寫的吧。。實在是太簡單了。。幸福吧!

第一步 加入jQuery類庫 放在<head></head>裡面
<script language="JavaScript" type="text/javascript" src="jquery-1.2.1.pack.js"></script>

第二步 寫這個ajax函數吧!在這之前我來布置下body的成員吧。。
<a href="#" onclick="javascript:o();">kkk</a>
<div id="pp">55</div>
一個a和一個div,a的onclick事件運行了o函數。。現在咱們來寫這個o函數吧!!
function o(){
 $.get(
  "peng.txt",
  function(data){
  $("#pp").html(data);
    }
 );
}
peng.txt 是咱們擷取資料的檔案,這個可以是任何web檔案。。
function(data) 就是咱們上面反覆說的 [裝載完畢事件] 而data就是獲得的資料。。
$("#pp").html(data); 這個就是咱們執行的函數體。。它相當與 document.getElementById("pp").innerHTML = data;
就是文法不同。。意思是一樣的。。簡單吧。。吼吼。。

最後小提示下:資料要是utf8 的哦。。 也就是這裡的peng.txt 的編碼

代碼下載

相關文章

聯繫我們

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

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

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.