道者编程

jQuery AJAX方法

一:$.get() 方法

1:介绍:$.get方法基于HTTP发送GET请求

2:用法:

$.get("index.php",{id:5,page:1},function(data,status){ 
	alert(data);//返回数据			
},"json"); //json格式
index.php:请求地址

id和page:GET请求参数,以 Key/value 的键值对形式表示 

status:请求状态("success"、"notmodified"、"error"、"timeout"、"parsererror"),运行成功时,才能获取此状态,一般省略

响应数据类型这里为:json,也可以省略,默认字符串类型


二:$.post() 方法

1:介绍:$.post方法基于HTTP发送POST请求

2:用法:方法同上

$.post("index.php",{id:5,page:1},function(data,status){ 
	alert(data);//返回数据			
},"json"); //json格式

RESTFul 的PUT/PATCH/DELETE其实都是post请求,也可以通过POST带_method参数,比如DELETE提交:

$.post("index.php",{'_method':'DELETE',id:5,page:1},function(data,status){ 
	alert(data);//返回数据			
},"json"); //json格式


三:$.getJSON()

1:介绍:使用 AJAX 的 HTTP GET 请求获取 JSON 数据。

2:用法:和$.get方法类似,但不用指定json类型

$.getJSON("index.php",{id:5,page:1},function(data,status){ 
	alert(data);//返回json数据			
}); 


四:$.ajax() 方法

1:介绍:$.ajax()方法基于HTTP发送POST或者GET请求,也可以模拟REST请求规则,更底层的ajax()函数,能够实现更复杂的设计。

2:用法:

$.ajax({
    url: '1.php',
    data:{id:5,page:1}, //发送数据 可选
    type: 'POST', //方式
    dataType: 'json', // 可选
    timeout: 1000, //设置请求超时时间(毫秒)可选
    error: function(){
        alert('加载文档时出错');
    },
    success: function(data){
        alert(data);
 
    },
});

$.ajax()不仅能实现$.get,$.post,还可以设定beforeSend()、error()、success()以及complete()回调函数

更复杂的用法:

$.ajax({
    url: '1.php',
    data:{id:5,page:1}, //发送数据 可选
    type: 'POST', //方式
    dataType: 'json', // 可选
    timeout: 1000, //设置请求超时时间(毫秒)可选
    error: function(){
        alert('加载文档时出错');
    },
    success: function(data){
        //alert(data);
 
    },
	//发送请求前调用,这里加入"正在加载"  
	beforeSend:function(XMLHttpRequest){
            $("#doing").html("正在加载中,请稍后···"); 
    },
	//请求完成时运行的函数(在请求成功或失败之后均调用,即在 success 和 error 函数之后)。
	complete:function(XMLHttpRequest,textStatus){
           $("#doing").empty(); 
    },
});

getJSON和ajax方法可以实现跨域操作


五:json操作

1:直接解析

{"name":1,"sex":2,"aub":"china"}

$.post("index.php",{id:5},function(data,status){ 
	alert(data.name);
	alert(data.sex);
	alert(data.aub); //一维数组直接写
},"json"); //这里已经转化为json对象,所以可以直接获取

多维数组遍历即可

$.get("1.php",{id:5},function(data,status){
	for(var i = 0; i < data.length; i++) {
		alert(data[i].name);
	}
	
},"json"); //这里已经转化为json对象,所以可以直接获取
 

3:$.each方法

$.each非常强大,可以遍历json、对象、数组、DOM等

$.get("1.php",{id:5},function(data,status){

	$.each(data, function(commentIndex, comment){     
   		alert(comment['name']);     
	});
	
},'json'); 
 

4:object对象转换为json字符串

var json= JSON.stringify(data)

5:$.parseJSON

JSON字符串转为与之对应的JavaScript对象


最新评论:
我要评论:

看不清楚