用JQuery實現ajax技術的常用方法

標籤：fun   date()   ack   相對   ext   開發   點擊   jquery   json   

       在我的前一篇用js實現ajax的三種技術中，我提到了怎麼用原生的js代碼去實現ajax技術，但是 可以看到，代碼相對於來說還是比較多，在我們實際的開發中，我們用到的比較多的技術是用jquery來實現，因為相對於js來說， 用jquery來實現ajax技術會簡單很多，因為它將一些通用的代碼都封裝在一些方法裡面，我們可以直接調用方法即可使用， 非常方便，所有下面我就總結了關於jquery實現ajax的一些常用方法。

一、load(url, args)

概述：load()方法是最為簡單和常用的方法，它的方法是載入遠程 HTML 檔案代碼並插入至 DOM 中。
參數：url:目標URL
args:需要傳給目標url的參數

舉例：點擊a連結，在對應位置#msg加上a連結目標頁面返回來的Html代碼

$(function(){    $("a").click(function(){        var url=this.href;        var args={"time":new Date()};        $(‘$msg‘).load(url,args);        return false;    });})    

callback:回呼函數，當響應結束時，回呼函數被觸發，響應結果會返回給data參數，響應結果可以是xml;html;json的任意一種

二、$.get(url, args, [callback])

參數： url:待載入頁面的URL地址
args:需要傳給目標url的參數
callback:載入成功時回呼函數。
舉例：點擊a連結，在對應位置#msg加上a連結目標頁面返回來的xml代碼

$(function(){    $("a").click(function(){        var url=this.href;        var args={"time":new Date()};        //data是返回的響應資料        $.get(url,args,function(data){            //擷取xml檔案值的方法            var msg=$(data).find("name").text();            $("#msg").empty.append("需要添加的html代碼");        });        return false;    });})

三、$.getJSON(url, args, [callback])

參數： url:待載入頁面的URL地址
args:需要傳給目標url的參數
callback:載入成功時回呼函數。
說明：與get()方法稍有不同，在擷取響應結果時需要告知此返回結果是一個JSON檔案

舉例：點擊a連結，在對應位置#msg加上a連結目標頁面返回來的json檔案

$(function(){    $("a").click(function(){        var url=this.href;        var args={"time":new Date()};        //data是返回的響應資料        $.get(url,args,function(data){            //擷取json檔案值的方法,因為已經告知是json檔案，所以可以直接用data擷取            var msg=data.name;            $("#msg").empty.append("需要添加的html代碼");        });        return false;    });})

用JQuery實現ajax技術的常用方法