Jquery中$.ajax $.post load用法與區別

$.ajax用法

代碼如下

複製代碼

function getVerify(){  if($('#regRuser').val()){   var m=$('#regRuser').val();   if(/^13d{9}$/g.test(m)||(/^15[0-35-9]d{8}$/g.test(m))|| (/^18d{9}$/g.test(m))){    var postData = $('#reg_form').serialize();    $.ajax({     type: "POST",     url: "/ajax/getVerify",     data: postData,     success: function(msg){      if(msg>0){       alert('驗證碼已發送至您手機，請注意查收');       $('#getVerify').hide();       $('.regnav').css('background','url(/static/images/v10/regnav2.png)');       $('#checkvalidate').show();       f_timeout();       $('.abc').show();      }else if(msg==0){       alert('手機號已被註冊');      }     }    });   }else{    alert('請輸入正確的手機號');   }  } }

心細的朋友會發現中間有一個postData資料，而是由$('#reg_form').serialize();產生了，那麼$('#reg_form').serialize();會是什麼資料來，我們來簡單舉個執行個體

$.Form.serialize( NameValuePair )

虛擬一個表單，並設定表單控制項名與值。

參數
NameValuePair
必選項。設定虛擬表單控制項。該參數形式為：{ name1=value, name2=value2, ......}
傳回值
虛擬表單序列化後的字串，其格式如：username=%E5%95%8A%E8%94%A1&password=123456

描述
表單中如有 disabled=true 或者沒有 name 屬性的控制項將被忽略。同名控制項將發送一組同名但不同值的字串。該方法通常用於 Ajax 的提交參數(parameters)。

樣本

代碼如下

複製代碼

<form method="post" name="reg" action="http://localhost">   <input type="text" name="username" />   <input type="password" name="password" />   <input type="checkbox" name="interest" value="music" /> //新使用者興趣愛好調查，勾選   <input type="checkbox" name="interest" value="sport" /> //勾選   <input type="checkbox" name="interest" value="dance" /> //勾選   <input type="submit" value="使用者註冊" />   <input type="button" value="用JavaScript提交表單" onclick="test()" /> </form> <script type="text/javascript" > function test(){      alert( $.Form("reg").serialize( { regTime:new Date().toGMTString()} ) );  //serizlize 方法補充了一個時間控制項，控制項的name=regTime，值為目前時間。 //username=%E5%95%8A%E8%94%A1&password=123456&interest=music&interest=sport&interest=dance&regtime=Thu%2C%2027%20Sep%202007%2008%3A35%3A55%20UTC。 //注意裡面的同名表單 } </script>

從上面可以看得出來這個是ajax get格式了，資料量不能太大了。

$.post

jQuery.post( url, [data], [callback], [type] ) ：使用POST方式來進行非同步請求

參數：

url (String) : 發送請求的URL地址.

data (Map) : (可選) 要發送給伺服器的資料，以 Key/value 的索引值對形式表示。

callback (Function) : (可選) 載入成功時回呼函數(只有當Response的返回狀態是success才是調用該方法)。

type (String) : (可選)官方的說明是：Type of data to be sent。其實應該為用戶端請求的類型(JSON,XML,等等)

.post("Ajax.aspx", { Action: "post", Name: "lulu" },        function (data, textStatus){            // data 可以是 xmlDoc, jsonObj, html, text, 等等.      //this;    // 這個Ajax請求的選項配置資訊，請參考jQuery.get()說到的this     alert(data.result);        }, "json");點擊提交：

執行個體

代碼如下	複製代碼
function  sendMsg() {  var isphone=  checkPhone($("#username").val());  if(!isphone )  {   $("#btn").val("發送中...");   $.post("momsg.php",{"tel":$("#username").val()},function(data){     //alert(data);     if(data==0)//0  成功  1  不成功  2 手機號碼格式不對     {           //         }            });  }  else  {   alert('請輸入正確的手機號碼!');$("#username").focus();  }   }

這個最核心的一句是$.post("momsg.php",{"tel":$("#username").val()}了，這裡什麼意思，這個就是ajax $.post 與php或提交表單post是一樣的，前面欄位名，後來變數或數值。

$('#xxx').load(url,para)

調用load方法的完整格式是：load( url, [data], [callback] ),

•url：是指要匯入檔案的地址。
•data：選擇性參數；因為Load不僅僅可以匯入靜態html檔案，還可以匯入動態指令碼，例如PHP檔案，所以要匯入的是動態檔案時，我們可以把要傳遞的參數放在這裡。
•callback：選擇性參數；是指調用load方法並得到伺服器響應後，再執行的另外一個函數。

代碼如下	複製代碼
$("#content").load("你自己的網站下的xx.aspx");

在你的xx.aspx裡使用WebRequest訪問"http://www.baidu.com，將結果返回給js

一：如何使用data

1.載入一個php檔案，該php檔案不含傳遞參數

代碼如下	複製代碼
$("#myID").load("test.php");

//在id為#myID的元素裡匯入test.php運行後的結果
2. 載入一個php檔案，該php檔案含有一個傳遞參數

代碼如下	複製代碼
$("#myID").load("test.php",{"name" : "Adam"});

//匯入的php檔案含有一個傳遞參數，類似於：test.php?name=Adam
3. 載入一個php檔案，該php檔案含有多個傳遞參數。註：參數間用逗號分隔

代碼如下	複製代碼
$("#myID").load("test.php",{"name" : "Adam" ，"site":"61dh.com"});

//匯入的php檔案含有一個傳遞參數，類似於：test.php?name=Adam&site=61dh.com

4. 載入一個php檔案，該php檔案以數組作為傳遞參數

代碼如下	複製代碼
$("#myID").load("test.php",{'myinfo[]', ["Adam", "61dh.com"]});

//匯入的php檔案含有一個數組傳遞參數。
注意：使用load，這些參數是以POST的方式傳遞的，因此在test.php裡，不能用GET來擷取參數