ajax使用回调函数的例子（原生代码和jquery代码）

http://hi.baidu.com/7636553/item/bbcf5fc93c8c950aac092f22

ajax使用回调函数的例子（原生代码和jquery代码）

一、 ajax代码存在的问题（异步交互的问题）

ajax所请求的url，如果因为网络等问题，很久没有回应，则给用户造成“假死”的现象。

代码如下：

xmlHttp = GetXmlHttpObject();

xmlHttp.open();

xmlHttp.send();

//下面这句，会一直等待，直到有返回值

alert(xmlHttp.responseText);

 

二、 ajax代码异步交互的解决方式

1. Javascript原生ajax代码

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

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

2. jquery中ajax的写法

（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){

//ShowLoading();

},

success: function(data, textStatus){

$(".ajax.ajaxResult").html("");

$("item",data).each(function(i, domEle){

$(".ajax.ajaxResult").append("

"+$(domEle).children("title").text()+"

");

});

},

complete: function(XMLHttpRequest, textStatus){

//HideLoading();

},

error: function(){

//请求出错处理

}

});