jquery中ajax学习笔记3


Posted in Javascript onOctober 16, 2011

摘要:
ajax学习1中介绍了使用jquery封装的ajax来接收服务器端的文本数据以及使用XMLHttpReques对象来接收服务器端的文本数据
ajax学习2中介绍了使用XMLHttpReques来接收服务器的端XML数据,本节主要介绍使用jqery封装的ajax使用XML格式接收服务器端的数据。

由于很多知识都已经做了详细介绍,本节只介绍需要修改的代码,使用jqery封装的ajax使用XML格式接收服务器端的数据,web.xml、后台的servet都不用改,
只是ajax.html中调用的方法名称修改一下,改为新增加的javascript方法。

用到的主要的一个方法介绍:
jQuery.ajax(options):通过HTTP请求加载远程数据,
返回值:XMLHttpRequest
参数:options(可选),ajax请求设置。所有选项都是可选的。
主要选项介绍:
type (String) : (默认: "GET") 请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持
url (String) : (默认: 当前页地址) 发送请求的地址
data (Object,String) : 发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后
dataType (String) : 预期服务器返回的数据类型。
如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息返回 responseXML 或 responseText,并作为回调函数参数传递,可用值:
"xml": 返回 XML 文档,可用 jQuery 处理。
"html": 返回纯文本 HTML 信息;包含 script 元素。
"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。
"json": 返回 JSON 数据
success (Function) : 请求成功后回调函数。参数:服务器返回数据,数据格式
error (Function) : (默认: 自动判断 (xml 或 html)) 请求失败时调用时间
async (Boolean) : (默认: true) 默认设置下,所有请求均为异步请求。
如果需要发送同步请求,请将此选项设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行

新增的javascript方法如下:

<!--用户名称的校验,采用jquery封装的ajax,接收XML格式的响应数据--> 
//通过$.ajax()方法 通过HTTP请求加载远程数据 
function verifyJqueryXML(){ 
var jqueryObj= $("#username"); 
var username= jqueryObj.val(); 
//javascript当中,一个简单的对象的定义方法 
//var obj={name:"abc",age:20}; 
//使用jquery的XMLHTTPRequest对象的get请求的封装 
$.ajax({ 
type:"POST",//请求方式 
url:"AJAXXMLServer", //服务器端的url地址 
data:"name="+username, // 发送给服务器端的数据 
dataType:"xml", //告诉Jquery返回的数据格式 
success:callback1 //定以交互完成,并且服务器端正确返回数据时调用的回调函数 
}); //注意url和 dataType必须对应 
} 
function callback1(data){ 
//首先需要将dom的对象转换成Jquery对象 
var jqueryObj=$(data); 
//获取message节点 
var message=jqueryObj.children(); 
//获取文本内容 
var text=message.text(); 
//将服务器端的值动态的显示在页面上 
var resultObj=$("#result"); 
resultObj.html(text); 
}

通过以上代得到,ajax.html中的调用javascript方法名称应改为:verifyJqueryXML()
Javascript 相关文章推荐
鼠标右击事件代码(asp.net后台)
Jan 27 Javascript
使用Java实现简单的server/client回显功能的方法介绍
May 03 Javascript
node.js中的Socket.IO使用实例
Nov 04 Javascript
jQuery函数map()和each()介绍及异同点分析
Nov 08 Javascript
Bootstrap每天必学之进度条
Nov 30 Javascript
认识jQuery的Promise的具体使用方法
Oct 10 jQuery
vue组件与复用详解
Apr 08 Javascript
VUE渲染后端返回含有script标签的html字符串示例
Oct 28 Javascript
vue实现图片上传到后台
Jun 29 Javascript
vue项目中企业微信使用js-sdk时config和agentConfig配置方式详解
Dec 15 Vue.js
Javascript中的解构赋值语法详解
Apr 02 Javascript
pnpm对npm及yarn降维打击详解
Aug 05 Javascript
jquery ajax学习笔记2 使用XMLHttpRequest对象的responseXML
Oct 16 #Javascript
jquery中ajax学习笔记一
Oct 16 #Javascript
jQuery EasyUI API 中文文档 DateTimeBox日期时间框
Oct 16 #Javascript
自己动手制作jquery插件之自动添加删除行功能介绍
Oct 14 #Javascript
javascript nextSibling 与 getNextElement(node) 使用介绍
Oct 13 #Javascript
获取body标签的两种方法
Oct 13 #Javascript
自己动手制作jquery插件之自动添加删除行的实现
Oct 13 #Javascript
You might like
使用php4加速网络传输
2006/10/09 PHP
又一个PHP实现的冒泡排序算法分享
2014/08/21 PHP
php封装的smarty类完整实例
2016/10/19 PHP
php compact 通过变量创建数组
2016/11/15 PHP
PHP实现的函数重载功能示例
2018/08/03 PHP
thinkphp5.1框架模板布局与模板继承用法分析
2019/07/19 PHP
Javascript实例教程(19) 使用HoTMetal(7)
2006/12/23 Javascript
jquery 表单进行客户端验证demo
2009/08/24 Javascript
关于setInterval、setTimeout在jQuery中的使用注意事项
2011/09/28 Javascript
提高javascript效率 一次判断,而不要次次判断
2012/03/30 Javascript
Jquery index()方法 获取相应元素索引值
2012/10/12 Javascript
使用JavaScript动态设置样式实现代码及演示动画
2013/01/25 Javascript
图片轮换效果实现代码(点击按钮停止执行)
2013/04/12 Javascript
GridView中获取被点击行中的DropDownList和TextBox中的值
2013/07/18 Javascript
JS实现控制表格行内容垂直对齐的方法
2015/03/30 Javascript
Extjs4.0 ComboBox如何实现三级联动
2016/05/11 Javascript
JavaScript对象数组如何按指定属性和排序方向进行排序
2016/06/15 Javascript
用js实现博客打赏功能
2016/10/24 Javascript
浅谈jQuery中Ajax事件beforesend及各参数含义
2016/12/03 Javascript
layui 实现加载动画以及非真实加载进度的方法
2019/09/23 Javascript
ES6 async、await的基本使用方法示例
2020/06/06 Javascript
微信小程序中的列表切换功能实例代码详解
2020/06/09 Javascript
Vue2.0 ES6语法降级ES5的操作
2020/10/30 Javascript
[02:12]探秘2016国际邀请赛中国区预选赛选手房间
2016/06/25 DOTA
[01:11:32]VG vs FNATIC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python中设置变量访问权限的方法
2015/04/27 Python
基于Python List的赋值方法
2018/06/23 Python
Python OpenCV处理图像之滤镜和图像运算
2018/07/10 Python
pycharm工具连接mysql数据库失败问题
2020/04/01 Python
HTML5 Canvas的性能提高技巧经验分享
2013/07/02 HTML / CSS
Grow Gorgeous美国官网:只要八天,体验唤醒毛囊后新生的茂密秀发
2018/06/04 全球购物
英国在线汽车和面包车零件商店:Car Parts 4 Less
2018/08/15 全球购物
工厂实习感言
2014/01/14 职场文书
空气的环保标语
2014/06/12 职场文书
天地会口号
2014/06/17 职场文书
Python自然语言处理之切分算法详解
2021/04/25 Python