关于JQuery中$.get()和$.post()和$.ajax()的区别和使用

转载：原文请点击此处

　　

首先，这三个方法都是Ajax方法中一种与服务器交换数据的请求类型。

 

一、$.get()

　　$.get() 方法使用 HTTP GET 请求从服务器加载数据。

　　使用格式： $.get(url,[data],[callback]) 

　　说明：　url为请求地址，

　　　　　　data为请求数据的列表(是可选的，也可以将要传的参数写在url里面)，

　　　　　　callback为请求成功后的回调函数，该函数接受两个参数，第一个为服务器返回的数据，第二个参数为服务器的状态，是可选参数。

　　　　　　（其中，服务器返回数据的格式其实是字符串形势，并不是我们想要的json数据格式，在此引用只是为了对比说明。）　　

1 $("button").click(function(){
2 　　$.get("url",function(data,status){
3 　　　　alert("Data: " + data + "nStatus: " + status);
4 　　});
5 }); 

官方语法： $.get(URL,data,function(data,status,xhr),dataType)  

参数	描述
URL	必需。规定您需要请求的 URL。
data	可选。规定连同请求发送到服务器的数据。
function(data,status,xhr)	可选。规定当请求成功时运行的函数。 额外的参数： data - 包含来自请求的结果数据 status - 包含请求的状态（"success"、"notmodified"、"error"、"timeout"、"parsererror"） xhr - 包含 XMLHttpRequest 对象

</tr>

dataType 可选。规定预期的服务器响应的数据类型。
默认地，jQuery 会智能判断。
可能的类型：

• "xml" - 一个 XML 文档
• "html" - HTML 作为纯文本
• "text" - 纯文本字符串
• "script" - 以 JavaScript 运行响应，并以纯文本返回
• "json" - 以 JSON 运行响应，并以 JavaScript 对象返回
• "jsonp" - 使用 JSONP 加载一个 JSON 块，将添加一个 "?callback=?" 到 URL 来规定回调

 

二、 $.post()

　　$.post() 方法使用 HTTP POST 请求从服务器加载数据。

　　官方语法： $(selector).post(URL,data,function(data,status,xhr),dataType)  

参数	描述
URL	必需。规定将请求发送到哪个 URL。

data 可选。规定连同请求发送到服务器的数据。 function(data,status,xhr) 可选。规定当请求成功时运行的函数。
额外的参数：

• data - 包含来自请求的结果数据
• status - 包含请求的状态（"success"、"notmodified"、"error"、"timeout"、"parsererror"）
• xhr - 包含 XMLHttpRequest 对象

</tr>

dataType 可选。规定预期的服务器响应的数据类型。
默认地，jQuery 会智能判断。
可能的类型：

• "xml" - 一个 XML 文档
• "html" - HTML 作为纯文本
• "text" - 纯文本字符串
• "script" - 以 JavaScript 运行响应，并以纯文本返回
• "json" - 以 JSON 运行响应，并以 JavaScript 对象返回
• "jsonp" - 使用 JSONP 加载一个 JSON 块，将添加一个 "?callback=?" 到 URL 来规定回调

这个函数跟$.get()参数差不多，多了一个type参数，type为返回的数据类型，可以是html,xml,json等类型，如果我们设置这个参数为：json，那么返回的格式则是json格式的，如果没有设置，就 和$.get()返回的格式一样，都是字符串的。

$.post("emp.do?p=getAllEmp",{id:deptId,x:Math.random()},function(data){
            var arry = eval("("+data+")");//去引号，将json字符串去引号编程json类型数组，也可以在$.post函数后面加一个参数"json"，指定接收的数据为json类型的
            for(var i=0;i<arry.length;i++){
                var op = new Option(arry[i].empName,arry[i].empId);
                document.getElementById("emp").options.add(op);
            }
        });

 

三、$.ajax(opiton)

　　与上面两个相比，这个可以执行精确的需求控制。

　　ajax() 方法用于执行 AJAX（异步 HTTP）请求。

　　所有的 jQuery AJAX 方法都使用 ajax() 方法。该方法通常用于其他方法不能完成的请求。

　　官方语法： $.ajax({name:value, name:value, ... })  

而所有可能出现在括号里面的参数列表如下： （比较重要和常见的已经标红）

</tr>

名称	值/描述
async	布尔值，表示请求是否异步处理。默认是 true。
beforeSend(xhr)	发送请求前运行的函数。
cache	布尔值，表示浏览器是否缓存被请求页面。默认是 true。
complete(xhr,status)	请求完成时运行的函数（在请求成功或失败之后均调用，即在 success 和 error 函数之后）。

contentType 发送数据到服务器时所使用的内容类型。默认是："application/x-www-form-urlencoded"。

</tr>

context 为所有 AJAX 相关的回调函数规定 "this" 值。

</tr>

data 规定要发送到服务器的数据。

</tr>

dataFilter( data, type) 用于处理 XMLHttpRequest 原始响应数据的函数。

</tr>

dataType 预期的服务器响应的数据类型。

</tr>

error(xhr,status,error) 如果请求失败要运行的函数。

</tr>

global 布尔值，规定是否为请求触发全局 AJAX 事件处理程序。默认是 true。

</tr>

ifModified 布尔值，规定是否仅在最后一次请求以来响应发生改变时才请求成功。默认是 false。

</tr>

jsonp 在一个 jsonp 中重写回调函数的字符串。

</tr>

jsonpCallback 在一个 jsonp 中规定回调函数的名称。

</tr>

password 规定在 HTTP 访问认证请求中使用的密码。

</tr>

processData 布尔值，规定通过请求发送的数据是否转换为查询字符串。默认是 true。

</tr>

scriptCharset 规定请求的字符集。

</tr>

success( result,status,xhr) 当请求成功时运行的函数。

</tr>

timeout 设置本地的请求超时时间（以毫秒计）。

</tr>

traditional 布尔值，规定是否使用参数序列化的传统样式。

</tr>

type 规定请求的类型（GET 或 POST）。

</tr>

url 规定发送请求的 URL。默认是当前页面。

</tr>

username 规定在 HTTP 访问认证请求中使用的用户名。

</tr>

xhr 用于创建 XMLHttpRequest 对象的函数。

示例：

 

 1 //根据id查询数据
 2 $.ajax({ 
 3     type:"POST",    //请求类型
 4     url: "你的url地址", 
 5     dataType:"json",//服务器返回的数据类型
 6     async: false,    //是否同步
 7     data:{             //这里需要注意的是，这个data是做为参数传值到后台的，因为是post,所以可以定义多个
 8         "id" : id
 9         //"name": "youName",    //注意，这里只是示范，冒号前面为变量名称，后面为需要传递的值
10         //"age" : "youAge",
11         //"sex" : "youAge",
12         //"other" : "other"
13         },
14     success:function(data){      //回调结果，如果成功
15         if(data.status == 0){    //判断状态码
16             //刷新
17             $("#easyuiDatagrid").datagrid("reload");
18         }
19     },
20     failure:function(result) { 
21             parent.$.messager.show({title : "提示",msg : "失败，请联系管理员",timeout : 3000});
22         }
23     });

 

参考：　　

　　$.ajax() 参数详细说明：http://www.cnblogs.com/tylerdonet/p/3520862.html

　　三个方法区别详细解读：http://www.cnblogs.com/liuling/archive/2013/02/07/sdafsd.html

　　Ajax方法集的链接：http://www.runoob.com/jquery/jquery-ref-ajax.html