Ajax的回调函数（js与JQuery写法）

什么是ajax回调函数

如果要处理ajax请求后得到的数据，则需要使用回调函数

success：请求后成功调用，传入返回的数据

error：请求后失败调用，返回错误类型和异常原因

beforeSend：请求前调用，传入XMLHttpRequest 作为参数

dataFilter：请求成功后调用，传入返回的数据和dataType参数值

complete：请求后调用，无论成功还是失败，返回XMLHttpRequest 对象，以及一个包含成功或错误代码的字符串

代码示例

JS原生写法

创建xmlhttp对象，然后执行open和send，通过xmlHttp.onreadystatechange = stateChanged回调函数来处理返回值。

readyState== 0 //尚未加载
readyState== 1 //正在加载
readyState== 2 //加载完毕
readyState== 3 //正在处理
readyState== 4 //处理完毕

//创建ajax
function testAjax () {
  xmlHttp = GetXmlHttpObject();
  if (xmlHttp == null) {
    alert("浏览器不支持");
    return;
  }

  var url = "http://www.xx.com";
  xmlHttp.onreadystatechange = stateChanged;
  xmlHttp.open("GET", url, true);
  xmlHttp.send();
  //document.getElementByIdx_x("txt").innerHTML=xmlHttp.responseText;

}

//创建不同的ajax对象
function GetXmlHttpObject () {

  var xmlHttp = null;
  try {
    //firefox opera safari
    xmlHttp = new XMLHttpRequest();
  } catch (e) {
    //ie
    try {
      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
      xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
  }
  return xmlHttp;
}

//监控状态
function stateChanged () {
  if (xmlHttp.readyState == 4) {
    //document.getElementByIdx_x("txt").innerHTML=xmlHttp.responseText;
    alert(xmlHttp.responseText);
  }

}

 JQuery写法

// （1）Post写法
var txt = $("input").val();//换的某个输入框的value
//使用post方法，传输值为suggest=txt，绑定回调函数
$.post("test.html", { suggest: txt }, function (result) {
  $("#div").html(result);
});


// （2）Get写法
var txt = $("input").val();//换的某个输入框的value
//使用get方法，传输值为suggest=txt，绑定回调函数
$.get("test.html", { suggest: txt }, function (result) {
  $("#div").html(result);
});


// （3）ajax写法（通过http请求）
$.ajax({
  type: "get",
  url: "http://www.cnblogs.com/rss",
  beforeSend: function (XMLHttpRequest) {
    //代码段;
  },

  success: function (data, textStatus) {
    $(".ajax.ajaxResult").html("");
    $("item", data).each(function (i, domEle) {
      $(".ajax.ajaxResult").append(
        "代码段")
    });
  },

  complete: function (XMLHttpRequest, textStatus) {
    //代码段;
  },

  error: function () {
    //请求出错处理
  }

});