$.ajax() ,$.post(),$.get() 的用法

在編寫代碼的過程當中，咱們會用到一些的需要局部刷新，並且須要數據傳遞的狀況，咱們一般是有$.ajax() ,$.post(),$.get() 這三種方式。

$.ajax()方法經過 HTTP 請求加載遠程數據。

最簡單的狀況下，$.ajax() 能夠不帶任何參數直接使用。

注意：全部的選項均可以經過 $.ajaxSetup() 函數來全局設置。

$.ajax({
      type: "POST",      //data 傳送數據類型。post 傳遞
      dataType: 'json',  // 返回數據的數據類型json
      url: "/site/abc",  // yii 控制器/方法
      cache: false,      
      data: {tel: tel},  //傳送的數據
      error:function(){
         alert("數據傳輸錯誤");
      },success: function (data) {
         if(window.console){
            console.log(data);
         }
      }
})         

         

$.ajax 的屬性：【詳解】http://www.w3school.com.cn/jquery/ajax_ajax.asp

dataType

類型：String

預期服務器返回的數據類型。若是不指定，jQuery 將自動根據 HTTP 包 MIME 信息來智能判斷，好比 XML MIME 類型就被識別爲 XML。在 1.4 中，JSON 就會生成一個 JavaScript 對象，而 script 則會執行這個腳本。隨後服務器端返回的數據會根據這個值解析後，傳遞給回調函數。可用值:

• "xml": 返回 XML 文檔，可用 jQuery 處理。
• "html": 返回純文本 HTML 信息；包含的 script 標籤會在插入 dom 時執行。
• "script": 返回純文本 JavaScript 代碼。不會自動緩存結果。除非設置了 "cache" 參數。注意：在遠程請求時(不在同一個域下)，全部 POST 請求都將轉爲 GET 請求。（由於將使用 DOM 的 script標籤來加載）
• "json": 返回 JSON 數據 。 輸出 數據（yii控制器中）

  public function(){
        echo CJSON::encode($message);
  }

  　　

• "jsonp": JSONP 格式。使用 JSONP 形式調用函數時，如 "myurl?callback=?" jQuery 將自動替換 ? 爲正確的函數名，以執行回調函數。
• "text": 返回純文本字符串

data

類型：String

發送到服務器的數據。將自動轉換爲請求字符串格式。GET 請求中將附加在 URL 後。查看 processData 選項說明以禁止此自動轉換。必須爲 Key/Value 格式。若是爲數組，jQuery 將自動爲不一樣值對應同一個名稱。如 {foo:["bar1", "bar2"]} 轉換爲 '&foo=bar1&foo=bar2'。

error

類型：Function

默認值: 自動判斷 (xml 或 html)。請求失敗時調用此函數。

有如下三個參數：XMLHttpRequest 對象、錯誤信息、（可選）捕獲的異常對象。

若是發生了錯誤，錯誤信息（第二個參數）除了獲得 null 以外，還多是 "timeout", "error", "notmodified" 和 "parsererror"。

這是一個 Ajax 事件。

$.post() 方法經過 HTTP POST 請求從服務器載入數據。【詳細】http://www.w3school.com.cn/jquery/ajax_post.asp

語法：

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)

參數	描述
url	必需。規定把請求發送到哪一個 URL。
data	可選。映射或字符串值。規定連同請求發送到服務器的數據。
success(data, textStatus, jqXHR)	可選。請求成功時執行的回調函數。
dataType	可選。規定預期的服務器響應的數據類型。 默認執行智能判斷（xml、json、script 或 html）。

例子：

向頁面 test.php 發送數據，並輸出結果（HTML 或 XML，取決於所返回的內容）：

 

1 $.post("test.php", { name: "John", time: "2pm" },
2    function(data){
3      alert("Data Loaded: " + data);
4    });

$.get()  【詳細】http://www.w3school.com.cn/jquery/ajax_get.asp

例子：

1 $("button").click(function(){
2   $.get("demo_ajax_load.txt", function(result){
3     $("div").html(result);
4   });
5 });

例子 1

請求 test.php 網頁，傳送2個參數，忽略返回值：

$.get("test.php", { name: "John", time: "2pm" } );

例子 2

顯示 test.php 返回值(HTML 或 XML，取決於返回值)：

$.get("test.php", function(data){
  alert("Data Loaded: " + data);
});

例子 3

顯示 test.cgi 返回值(HTML 或 XML，取決於返回值)，添加一組請求參數：

$.get("test.cgi", { name: "John", time: "2pm" },
  function(data){
    alert("Data Loaded: " + data);
  });