关于JQuery中$.get()和$.post()和$.ajax()的区别和使用
首先,这三个方法都是Ajax方法中一种与服务器交换数据的请求类型。
一、$.get()
$.get() 方法使用 HTTP GET 请求从服务器加载数据。
使用格式: $.get(url,[data],[callback])
说明: url为请求地址,
data为请求数据的列表(是可选的,也可以将要传的参数写在url里面),
callback为请求成功后的回调函数,该函数接受两个参数,第一个为服务器返回的数据,第二个参数为服务器的状态,是可选参数。
(其中,服务器返回数据的格式其实是字符串形势,并不是我们想要的json数据格式,在此引用只是为了对比说明。)
$("button").click(function(){
$.get("url",function(data,status){
alert("Data: " + data + "nStatus: " + status);
});
});
官方语法: $.get(URL,data,function(data,status,xhr),dataType)
| 参数 | 描述 |
|---|---|
| URL | 必需。规定您需要请求的 URL。 |
| data | 可选。规定连同请求发送到服务器的数据。 |
| function(data,status,xhr) | 可选。规定当请求成功时运行的函数。 额外的参数:
|
| dataType |
可选。规定预期的服务器响应的数据类型。 默认地,jQuery 会智能判断。 可能的类型:
|
二、 $.post()
$.post() 方法使用 HTTP POST 请求从服务器加载数据。
官方语法: $(selector).post(URL,data,function(data,status,xhr),dataType)
| 参数 | 描述 |
|---|---|
| URL | 必需。规定将请求发送到哪个 URL。 |
| data | 可选。规定连同请求发送到服务器的数据。 |
| function(data,status,xhr) | 可选。规定当请求成功时运行的函数。 额外的参数:
|
| dataType |
可选。规定预期的服务器响应的数据类型。 默认地,jQuery 会智能判断。 可能的类型:
|
这个函数跟$.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, ... })
而所有可能出现在括号里面的参数列表如下: (比较重要和常见的已经标红)
| 名称 | 值/描述 |
|---|---|
| async | 布尔值,表示请求是否异步处理。默认是 true。 |
| beforeSend(xhr) | 发送请求前运行的函数。 |
| cache | 布尔值,表示浏览器是否缓存被请求页面。默认是 true。 |
| complete(xhr,status) | 请求完成时运行的函数(在请求成功或失败之后均调用,即在 success 和 error 函数之后)。 |
| contentType | 发送数据到服务器时所使用的内容类型。默认是:"application/x-www-form-urlencoded"。 |
| context | 为所有 AJAX 相关的回调函数规定 "this" 值。 |
| data | 规定要发送到服务器的数据。 |
| dataFilter(data,type) | 用于处理 XMLHttpRequest 原始响应数据的函数。 |
| dataType | 预期的服务器响应的数据类型。 |
| error(xhr,status,error) | 如果请求失败要运行的函数。 |
| global | 布尔值,规定是否为请求触发全局 AJAX 事件处理程序。默认是 true。 |
| ifModified | 布尔值,规定是否仅在最后一次请求以来响应发生改变时才请求成功。默认是 false。 |
| jsonp | 在一个 jsonp 中重写回调函数的字符串。 |
| jsonpCallback | 在一个 jsonp 中规定回调函数的名称。 |
| password | 规定在 HTTP 访问认证请求中使用的密码。 |
| processData | 布尔值,规定通过请求发送的数据是否转换为查询字符串。默认是 true。 |
| scriptCharset | 规定请求的字符集。 |
| success(result,status,xhr) | 当请求成功时运行的函数。 |
| timeout | 设置本地的请求超时时间(以毫秒计)。 |
| traditional | 布尔值,规定是否使用参数序列化的传统样式。 |
| type | 规定请求的类型(GET 或 POST)。 |
| url | 规定发送请求的 URL。默认是当前页面。 |
| username | 规定在 HTTP 访问认证请求中使用的用户名。 |
| xhr | 用于创建 XMLHttpRequest 对象的函数。 |
示例:
//根据id查询数据
$.ajax({
type:"POST", //请求类型
url: "你的url地址",
dataType:"json",//服务器返回的数据类型
async: false, //是否同步
data:{ //这里需要注意的是,这个data是做为参数传值到后台的,因为是post,所以可以定义多个
"id" : id
//"name": "youName", //注意,这里只是示范,冒号前面为变量名称,后面为需要传递的值
//"age" : "youAge",
//"sex" : "youAge",
//"other" : "other"
},
success:function(data){ //回调结果,如果成功
if(data.status == 0){ //判断状态码
//刷新
$("#easyuiDatagrid").datagrid("reload");
}
},
failure:function(result) {
parent.$.messager.show({title : "提示",msg : "失败,请联系管理员",timeout : 3000});
}
});
参考:
$.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
关于JQuery中$.get()和$.post()和$.ajax()的区别和使用的更多相关文章
- jQuery源码分析系列(31) : Ajax deferred实现
AJAX的底层实现都是浏览器提供的,所以任何基于api上面的框架或者库,都只是说对于功能的灵活与兼容维护性做出最优的扩展 ajax请求的流程: 1.通过 new XMLHttpRequest 或其它的 ...
- 利用jQuery与.ashx完成简单的Ajax
在ASP.NET同样可以与其它编程语言一样,利用前台的Ajax技术,只是需要注意的是,后台的处理程序不再是一个aspx页面中的Page_Load,而且ASP.NET独有的“一般处理程序”.ashx,下 ...
- JSONP原理及jQuery中的使用
JSONP原理 JSON和JSONP JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,用于在浏览器和服务器之间交换信息. JSONP(JSON ...
- jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)
1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @Paren ...
- 类似jQuery的原生JS封装的ajax方法
一,前言: 前文,我们介绍了ajax的原理和核心内容,主要讲的是ajax从前端到后端的数据传递的整个过程. Ajax工作原理和原生JS的ajax封装 真正的核心就是这段代码: var xhr = ne ...
- Jquery 一次处理多个ajax请求的代码
Jquery 一次处理多个ajax请求的代码,需要的朋友可以参考下. 复制代码代码如下: $(document).ready(function () { $('#getsetgo').click( ...
- jQuery实现form表单基于ajax无刷新提交方法详解
本文实例讲述了jQuery实现form表单基于ajax无刷新提交方法.分享给大家供大家参考,具体如下: 首先,新建Login.html页面: <!DOCTYPE html PUBLIC &quo ...
- JSON、JSONP、Ajax的区别
什么是JSON JSON是一种基于文本的数据交换方式,或者叫做数据描述格式. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascript原生支持,后台语言几乎全部支持: 3.轻量 ...
- jquery的bind跟on绑定事件的区别
jquery的bind跟on绑定事件的区别:主要是事件冒泡: jquery文档中bind和on函数绑定事件的用法: .bind(events [,eventData], handler) .on(ev ...
随机推荐
- [转]C语言的int最值问题,以及原码反码及补码
以2字节为例来说: 对于无符号的数值(原码反码及补码都一样),最大值为1111 1111 1111 1111=65535 最小值为0000 0000 0000 0000=0 对于有符号的来 ...
- pow()函数结果强制转化为int造成误差的分析
开发环境:codeblocks,编译器gcc 在计算102时调用pow(10, 2),再强制类型转换为int类型后输出: printf(,)); 得到的结果却是:99 这是因为 double pow( ...
- [转载]关于在Linux下上传代码至Github
刚开始使用Github没多长时间,所以很多地方不太熟练,看到阿里云上有一篇文章写得不错,故转载过来. 转载自:https://www.aliyun.com/jiaocheng/122729.html ...
- Centos7.5 安装VirtualBox增强工具
一.安装 1.自带tools: 选择VirtualBox工具栏 => 设备 => 安装增强功能 2.挂载光驱 3.进入光驱目录,执行(一定要用root权限执行) ①安装gcc yum i ...
- Java对象模型规约
下面是我根据工作中项目的经验,总结的一套自己觉得比较方便的对象模型规约 model(实体模型) -vo(与前端交互的对象模型,前端泛指页面.移动端和远程服务调用等) ...
- 检测浏览器是否支持ES6
这是阮一峰老师写的一个工具 ES-Checker,用来检查各种运行环境对 ES6 的支持情况.访问ruanyf.github.io/es-checker,可以看到您的浏览器支持 ES6 的程度.运行下 ...
- vue-cli 3.0
安装 vue-cli 3.0 时报错 vue-cli3安装遇到的问题,卸载不掉旧版本,导致更新不了 vue-cli 2.9.6 版本卸载不了 作者:Runner_leaf链接:https://www. ...
- SQL入门(3):定义约束/断言assertion/触发器trigger
本文介绍数据库的完整性 完整性控制程序: 指定规则,检查规则 (规则就是约束条件) 动态约束 intergrity constraint::=(O,P,A,R) O : 数据集合, 约束的对象 ?: ...
- appJSON["window"]["navigationBarTextStyle"] 字段需为 black 或 white
appJSON["window"]["navigationBarTextStyle"] 字段需为 black 或 white 改动成这个就可以了 &qu ...
- jquery 第三章
1.回顾$(document).ready(function(){ })$(function(){ }) ID选择器.类选择器.元素选择器层次选择器:空格(上文下:tr td{})属性过滤 ...