jQuery Ajax

jQuery Ajax FeaturesGET and POST supportedLoad JSON,XML,HTML or even scripts <!-- 与Ajax相关的 XMLHTTP -->var xmlHttp = null;if (window.XMLHttpRequest) {    // IE7, Mozilla, Safari等浏览器，Use native object.    xmlHttp = new XMLHttpRequest();} else {    if (window.ActiveXObject) {        // ...其他浏览器，use the ActiveX control for IE5.x and IE6.        xmlHttp = new ActiveXObject('MSXML2.XMLHTTP.3.0');    }}<!--jQuery Ajax Functions -->$(selector).load():Loads HTML data from the server$.get() and $.post():Get raw data from the server$.getJSON():Get/Post and return JSON$.ajax():Provides core functionality<!-- Loading HTML Content from the Server --><!-- $(selector).load(url,data,callback) -->$(document).ready(function(){    $('#MyButton').click(function(){        $('#MyDiv').load('../HelpDetails.html #SubTOC');    });});<!-- 过滤页面信息 -->$('#MyDiv').load('HelpDetails.html #MainToc');<!-- passed data to the server -->$('#MyDiv').load('../GetCustomers.aspx', {PageSize: 25});<!-- 返回callback -->$('#MyDiv').load('NotFound.html',     function (response, status, xhr) {        if (status == "error") {    alert('Error:' + xhr.statusText);}    });<!-- 内核 -->function (url, params, callback) {  if (typeof url !== "string") {    return this._load(url);    //Don't do a request if no elements are being requested  } else if (!this.length) {    return this;  }  var off = url.indexof(" ");  if (off >= 0) {    var selector = url.slice(off, url.length);    url = url.slice(0, off);  }  //Default to a GET request  var type = "GET";  //If the second parameter was provided  if (params) {      //If it's a function      if (jQuery.isFunction(params)) {          //We assume that it's the callback          callback = params;          params = null;          // Otherwise, build a param string      } else if (typeof params === "object") {          params = jQuery.param(params, jQuery.ajaxSettings.traditional);          type = "POST"      }  }  // Request the remote document  jQuery.ajex({    url: url,    type: type,  //GET,POST    data: params,    context: this,    complete: function (res, srarus) {        //etc    }  });}

Using get()

<!-- $.get(url, date, callback, datatype) -->// example one:$.get('../HelpDetails.html', function (data) {    $('#MyDiv').html(data);});// example two:$.get('../CustomerJson.aspx', {id: 5 }, function (data) {    alert(data.FirstName);}, 'json');<!-- 内核 -->function (url, data, callback, datatype) {  //shift arguments if data argument was omited  if (jQuery.isFunction(data)) {    type = type || callback;    callback = data;    data = null;  }  return jQuery.ajax({    type: "GET",    url: url,    data: data,    success: callback,    dataType: type  //json,html,xml etc  });}

Using getJSON()

<!-- $.getJSON(url, data, callback) -->$.getJSON('../CustomerJson.aspx', {id: 1 }, function (data) {    alert(data.FirstName + '' + data.LastName);    // response.contentType = "application/json";});

Using post()

<!-- $.post(url, data, callback, datatype) -->$.post('../GetCustomers.aspx', {PageSize: 15 }, function (data) {    $('#MyDiv').html(data.FirstName);}, 'json');<!-- to Call a WCF Service -->$.post('../CustomerService.svc/GetCustomers', null, function (data) {    var cust = data.d[0];    alert(cust.FirstName + '' + cust.LastName);}, 'json');

The ajax() Function  （configured by assigning values to JSON properties）

<!--Configure using JSON properties:    1. contentType    2. data    3. dataType    4. error    5. success    6. type (GET or POST)-->$.ajax({    url: '../CustomerService.svc/InsertCustomer',    data: customer,    datatype: 'json',    success: function (data, status, xhr) {        alert("Insert status: " + data.d.Status + '\n' +                data.d.Message);    },    error: frunction (xhr, status, error) {        alert('Error occurred: ' + status);    }    // complete(XMLHttpRequest, textStatus) ..etc    // api.jquery.com/jQuery.ajax/});// example two:$('#MyButton').click(function () {    var customer = 'cust=' +        JSON.stringify({   // src="./json2.js"            FirstName: $('#FirstNameTB').val(),            LastName: $('#LastNameTB').val()        });    $.ajax({        url: '../CustomerService.svc/InsertCustomer',        data: customer,        dataType: 'json',        success: function (data, status, xhr) {            $('#MyDiv').html('Insert status: ' + data.d.Status);        },        error: function (xhr, status, error) {            alert('Error occurred: ' +status);        }    });});<!--  request headers: GET /CustomerService.svc/InsertCustomer?cust={"FirstName":"John","LastName":"Doe"} HTTP/1.1  -->

http://www.cnblogs.com/A_ming/archive/2010/04/13/1711395.html