jQuery中$.get()、$.post()和$.ajax()
jQuery.get()方法:
$.get(url,data,success(response,status,xhr),dataType)
该函数是简写的 Ajax 函数,等价于:
$.ajax({
url: url,
data: data,
success: success,
dataType: dataType
});
根据响应的不同的 MIME 类型,传递给 success 回调函数的返回数据也有所不同,这些数据可以是 XML root 元素、文本字符串、JavaScript 文件或者 JSON 对象。也可向 success 回调函数传递响应的文本状态。
| 参数 | 描述 |
|---|---|
| url | 必需。规定将请求发送的哪个 URL。 |
| data | 可选。规定连同请求发送到服务器的数据。 |
| success(response,status,xhr) |
可选。规定当请求成功时运行的函数。 额外的参数:
|
| dataType |
可选。规定预计的服务器响应的数据类型。 默认地,jQuery 将智能判断。 可能的类型:
|
使用 AJAX 的 GET 请求来改变 div 元素的文本:
$("button").click(function(){
$.get("demo_ajax_load.txt", function(result){
$("div").html(result);
});
});
jQuery.post()方法:
$.post(url,data,success(data, textStatus, jqXHR),dataType)
该函数是简写的 Ajax 函数,等价于:
$.ajax({
type: 'POST',
url: url,
data: data,
success: success,
dataType: dataType
});
根据响应的不同的 MIME 类型,传递给 success 回调函数的返回数据也有所不同,这些数据可以是 XML 根元素、文本字符串、JavaScript 文件或者 JSON 对象。也可向 success 回调函数传递响应的文本状态。
| 参数 | 描述 |
|---|---|
| url | 必需。规定把请求发送到哪个 URL。 |
| data | 可选。映射或字符串值。规定连同请求发送到服务器的数据。 |
| success(data, textStatus, jqXHR) | 可选。请求成功时执行的回调函数。 |
| dataType |
可选。规定预期的服务器响应的数据类型。 默认执行智能判断(xml、json、script 或 html)。 |
使用 AJAX 的 GET 请求来改变 div 元素的文本:
$("input").keyup(function(){
txt=$("input").val();
$.post("demo_ajax_gethint.asp",{suggest:txt},function(result){
$("span").html(result);
});
});
实例:
一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。示例代码:
Ajax.aspx:
Response.ContentType = "application/json";Response.Write("{result: '" + Request["Name"] + ",你好!(这消息来自服务器)'}");
jQuery 代码:
$.post("Ajax.aspx", { Action: "post", Name: "lulu" },
function (data, textStatus){
// data 可以是 xmlDoc, jsonObj, html, text, 等等.
//this;
// 这个Ajax请求的选项配置信息,请参考jQuery.get()说到的this
alert(data.result);
}, "json");
点击提交:
这里设置了请求的格式为"json":
$.ajax()这个是jQuery 的底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。
这里有几个Ajax事件参数:beforeSend ,success ,complete ,error 。我们可以定义这些事件来很好的处理我们的每一次的Ajax请求。
$.ajax({
url: 'stat.php',
type: 'POST',
data:{Name:"keyun"},
dataType: 'html',
timeout: 1000,
error: function(){alert('Error loading PHP document');},
success: function(result){alert(result);}
});
$.get()与$.post()的区别:
《计算机网络》对POST和GET方法在HTTP协议中的简单解释:HTTP协议定义了通信的两种报文:请求报文和响应报文。对于请求报文来说,它的通用格式包含三个主要部分:请求行、首部行、实体主体。通常请求行的格式为:方法字段 、 URL字段、 HTTP协议版本字段,其中方法字段就包括GET、POST方法等。
当方法字段是GET方法时内容主体为空,而是用POST方法时才使用实体主体。
HTTP客户机通常在用户提交表单时使用POST方法,这时,实体主体中所包含的就是用户在表单中的输入值。当然,GET方法也可以提交表单中的数据,它是通过将用户在表单中的输入值传送到正确的URL来实现的。这就是我们通常所看到的http://ei.hust.edu.cn?username="libis"&age=12。
可以看出,在表单提交的方式上两者存在很大的不同:
- Post方法将表单数据填充到HTTP请求报文中的实体主体部分,使用者是看不到的。而GET方法则是将表单数据直接传送到请求行的URL字段来实现表单数据提交的。这也就决定了使用POST是相对比较安全的,而是用GET方法的安全性就很低。
除此之外,GET方法和POST方法另一个重要的区别是:
- GET方法传送的数据量较小,一般只有2k。而POST方法传送的数据量较大,理论上没有上限。
$.ajax()需要注意的一些地方:
1.data主要方式有三种,html拼接的,json数组,form表单经serialize()序列化的;通过dataType指定,不指定智能判断。
2.$.ajax只提交form以文本方式,如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit
$.ajax() 实际应用例子
//1.$.ajax带json数据的异步请求
var aj = $.ajax( {
url:'productManager_reverseUpdate',// 跳转到 action
data:{
selRollBack : selRollBack,
selOperatorsCode : selOperatorsCode,
PROVINCECODE : PROVINCECODE,
pass2 : pass2
},
type:'post',
cache:false,
dataType:'json',
success:function(data) {
if(data.msg =="true" ){
// view("修改成功!");
alert("修改成功!");
window.location.reload();
}else{
view(data.msg);
}
},
error : function() {
// view("异常!");
alert("异常!");
}
}); //2.$.ajax序列化表格内容为字符串的异步请求
function noTips(){
var formParam = $("#form1").serialize();//序列化表格内容为字符串
$.ajax({
type:'post',
url:'Notice_noTipsNotice',
data:formParam,
cache:false,
dataType:'json',
success:function(data){
}
});
} //3.$.ajax拼接url的异步请求
var yz=$.ajax({
type:'post',
url:'validatePwd2_checkPwd2?password2='+password2,
data:{},
cache:false,
dataType:'json',
success:function(data){
if( data.msg =="false" ) //服务器返回false,就将validatePassword2的值改为pwd2Error,这是异步,需要考虑返回时间
{
textPassword2.html("<font color='red'>业务密码不正确!</font>");
$("#validatePassword2").val("pwd2Error");
checkPassword2 = false;
return;
}
},
error:function(){}
}); //4.$.ajax拼接data的异步请求
$.ajax({
url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',
type:'post',
data:'merName='+values,
async : false, //默认为true 异步
error:function(){
alert('error');
},
success:function(data){
$("#"+divs).html(data);
}
});
jQuery中$.get()、$.post()和$.ajax()的更多相关文章
- jquery+css3打造一款ajax分页插件
原文:[原创]jquery+css3打造一款ajax分页插件 最近公司的项目将好多分页改成了ajax的前台分页以前写的分页插件就不好用了,遂重写一个 支持IE6+,但没有动画效果如果没有硬需求,个人认 ...
- jQuery 提供多个与 AJAX 有关的方法。
jQuery 提供多个与 AJAX 有关的方法. 通过 jQuery AJAX 方法,您能够使用 HTTP Get 和 HTTP Post 从远程服务器上请求文本.HTML.XML 或 JSON - ...
- jQuery学习之旅 Item10 ajax快餐
1. 摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案, 即使你会使用jQuery也能在阅读中发现些许秘籍. 本篇文章讲解如何使用jQuery方便快捷的实现A ...
- jQuery中的$.getJSON、$.ajax、$.get、$.post的区别
jQuery中的$.getJSON.$.ajax.$.get.$.post的区别 使用见Flask(python)异步(ajax)返回json格式数据 ①.$.getJSON $.getJSON()是 ...
- jquery学习笔记(五):AJAX
内容来自[汇智网]jquery学习课程 5.1 ajax AJAX 是与服务器交换数据的艺术,它在不重载全部页面的情况下,实现了对部分网页的更新. AJAX = 异步 JavaScript 和 XML ...
- Ajax跨域原理及JQuery中的实现
浅析Ajax跨域原理及JQuery中的实现分析 AJAX 的出现使得网页可以通过在后台与服务器进行少量数据交换,实现网页的局部刷新.但是出于安全的考虑,ajax不允许跨域通信.如果尝试从不同的域请 ...
- [原创]jquery+css3打造一款ajax分页插件
最近公司的项目将好多分页改成了ajax的前台分页以前写的分页插件就不好用了,遂重写一个 支持IE6+,但没有动画效果如果没有硬需求,个人认为没必要多写js让动画在这些浏览器中实现css3的动画本来就是 ...
- Jquery中$.load(),$.get(),$.post(),$.ajax(),$.getJSON()的作用与不同
这个五个都是获取页面或者数据的方法.. 都是基于Ajax协议的.. $.get(url,[data],[callback]) //描述: 从服务器加载数据,请求方式为GET. url ...
- Jquery表单序列化和AJAX全局事件
Jquery表单序列化 1.必须放在form标签内: 2.控件必须有name属性: 3.控件的value值会提交到服务器: 如: <form id="form1"> & ...
- PHP利用jquery生成各种验证码和Ajax验证
PHP生成验证码图片 PHP生成验证码的原理:使用PHP的GD库,生成一张带验证码的图片,并将验证码保存在Session中.PHP 生成验证码的大致流程有: .产生一张png的图片: .为图片设置背景 ...
随机推荐
- VLC打开.264文件
昨天收到几个文件名是:xxx.264的文件,这种文件属于视频图像的raw files,即只包含视频数据.由于缺少视频头文件,所以一般播放器难以播放出来.网上很多介绍的是.H264文件如何打开,以及用一 ...
- POJ1182 食物链(并查集)
食物链 Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 55260 Accepted: 16210 Description ...
- 对List
class MyCompare implements Comparator//自定义比较方式 要实现Conparator的 compare 方法 { public int compare(O ...
- [转]C服务端与java客户端的socket通信注意事项
http://blog.csdn.net/gaoxin1076/article/details/7671752 Socket网络通讯开发总结之:Java 与 C进行Socket通讯 注意以下问题: 1 ...
- cobbler客户端重装系统
已有操作系统的主机通过koan从Cobbler服务器重装系统 1,安装epel rpm -ivh http://dl.fedoraproject.org/pub/epel/6/x86_64/epel- ...
- Jenkins 三: Jenkins CLI
简介 该工具允许用户通过命令行来操作jenkins. 使用方法 1. 下载 jenkins_cli.jar. 下载地址: http://localhost:8080/jnlpJars/jenkins- ...
- Hdu 3887 Counting Offspring \ Poj 3321 Apple Tree \BZOJ 1103 [POI2007]大都市meg
这几个题练习DFS序的一些应用. 问题引入: 给定一颗n(n <= 10^5)个节点的有根树,每个节点标有权值,现有如下两种操作: 1.C x y 以节点x的权值修改为y. 2.Q x ...
- 谈JSON在Ajax中的使用
JSON是一种轻量级的数据交换格式.易于人阅读和编写,同时也易于机器解析和生成.AJAX是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术.之前也曾介绍过在PHP语言中使用JSON的文章, ...
- SVN安装图解
SVN服务器搭建和使用(一) Subversion是优秀的版本控制工具,其具体的的优点和详细介绍,这里就不再多说. 首先来下载和搭建SVN服务器. 现在Subversion已经迁移到apache网站上 ...
- PHP安全编程:主机文件目录浏览(转)
除了能在共享服务器上读取任意文件之外,攻击者还能建立一个可以浏览文件系统的脚本.由于你的大多数敏感文件不会保存在网站主目录下,此类脚本一般用于找到你的源文件的所在位置.请看下例: 01 <?ph ...