javascript中ajax post實例詳解

一，原生態的XMLHttpRequest

 代碼如下 復制代碼
<script language="javascript">
    
    function saveintroduce()
    {
    //獲取接受返回信息層
    var introducemsg = document.getElementById("introducemsg");
    //獲取表單對象和用戶信息值
    var f = document.introduceedt;
    var elm1 = encodeURIComponent(f.elm1.value);
    //接收表單的URL地址
    var url = "save.php?id=<?=$_GET["id"]?>";
    //需要POST的值，www.111cn.net 把每個變量都通過&來聯接
    var postStr = 'elm1='+ elm1;
    //實例化Ajax
    //var ajax = InitAjax();
    var ajax = false;
    //開始初始化XMLHttpRequest對象
    if(window.XMLHttpRequest)
    { //Mozilla 瀏覽器
    ajax = new XMLHttpRequest();
    if (ajax.overrideMimeType)
    { //設置MiME類別
    ajax.overrideMimeType("text/xml");
    }
    }
    else if (window.ActiveXObject)
    { // IE瀏覽器
    try
    {
    ajax = new ActiveXObject("Msxml2.XMLHTTP");
    }
    catch (e)
    {
    try
    {
    ajax = new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e) {}
    }
    }
    if (!ajax)
    { // 異常，創建對象實例失敗
    window.alert("不能創建XMLHttpRequest對象實例.");
    return false;
    }
    
    //通過Post方式打開連接
    ajax.open("POST", url, true);
    //定義傳輸的文件HTTP頭信息
    ajax.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    //發送POST數據
    ajax.send(postStr);
    //獲取執行狀態
    ajax.onreadystatechange = function()
    {
    //如果執行狀態成功，那么就把返回信息寫到指定的層里
    if (ajax.readyState == 4 && ajax.status == 200)
    {
    introducemsg.innerHTML = ajax.responseText;
    }
    }
    }
    </script>
    
    <form id="introduceedt" name="introduceedt" action="save.php>" method="post">
    <input name="elm1" id="elm1" ><input type="button" value="提交表單" onClick="saveintroduce()"><div id="introducemsg"></div></div></td>
    
    </form>

二，jquery ajax.post

1.jQuery $.post() 方法

$.post() 方法通過 HTTP POST 請求從服務器上請求數據。

實例

 代碼如下 復制代碼
$("button").click(function(){
  $.post("demo_test_post.asp",
  {
    name:"Donald Duck",
    city:"Duckburg"
  },
  function(data,status){
    alert("Data: " + data + " Status: " + status);
  });
});
 

2、$.ajax的一般格式

 代碼如下 復制代碼
$.ajax({

     type: 'POST',

     url: url ,

    data: data ,

    success: success ,

    dataType: dataType

});

 
 

二、$.ajax的參數描述

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

默認執行智能判斷（xml、json、script 或 html）。

更多詳細內容請查看：http://www.111cn.net/wy/jquery/57064.htm