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 相关文章推荐
jQuery 获取对象 基本选择与层级
May 31 Javascript
谈谈Jquery中的children find 的区别有哪些
Oct 19 Javascript
Javascript实现Array和String互转换的方法
Dec 21 Javascript
jquery 抽奖小程序实现代码
Oct 12 Javascript
JS高仿抛物线加入购物车特效实现代码
Feb 20 Javascript
Angular.js 4.x中表单Template-Driven Forms详解
Apr 25 Javascript
在小程序中使用Echart图表的示例代码
Aug 02 Javascript
javascript中floor使用方法总结
Feb 02 Javascript
Openlayers实现扩散的动态点(水纹效果)
Aug 17 Javascript
Vue filter 过滤器、以及在table中的使用介绍
Sep 07 Javascript
vue实现标签云效果的示例
Nov 09 Javascript
token 机制和实现方式
Dec 15 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
DIY一个适配电脑声卡的动圈话筒放大器
2021/03/02 无线电
php笔记之:php数组相关函数的使用
2013/04/26 PHP
php通过array_push()函数添加多个变量到数组末尾的方法
2015/03/18 PHP
PHP使用mysql_fetch_object从查询结果中获取对象集的方法
2015/03/18 PHP
PHP实现的激活用户注册验证邮箱功能示例
2017/06/06 PHP
jQuery中setTimeout的几种使用方法小结
2013/04/07 Javascript
js弹出层(jQuery插件形式附带reLoad功能)
2013/04/12 Javascript
JS,Jquery获取select,dropdownlist,checkbox下拉列表框的值(示例代码)
2014/01/11 Javascript
jQuery实现鼠标单击网页文字后在文本框显示的方法
2015/05/06 Javascript
js实现网页图片延时加载 提升网页打开速度
2016/01/26 Javascript
JS在Chrome浏览器中showModalDialog函数返回值为undefined的解决方法
2016/08/03 Javascript
D3.js实现雷达图的方法详解
2016/09/22 Javascript
基于js实现checkbox批量选中操作
2016/11/22 Javascript
详解jQuery中的事件
2016/12/14 Javascript
vue.js实现仿原生ios时间选择组件实例代码
2016/12/21 Javascript
jQuery实现ajax无刷新分页页码控件
2017/02/28 Javascript
Angular2搜索和重置按钮过场动画
2017/05/24 Javascript
JavaScript中各数制转换全面总结
2017/08/21 Javascript
vue组件初学_弹射小球(实例讲解)
2017/09/06 Javascript
基于Angularjs-router动态改变Title值的问题
2018/08/30 Javascript
webpack 3.X学习之多页面打包的方法
2018/09/04 Javascript
vue大型项目之分模块运行/打包的实现
2020/09/21 Javascript
[06:37]2014DOTA2国际邀请赛 昔日王者渴望重回巅峰
2014/07/12 DOTA
[49:28]VP vs Optic 2018国际邀请赛小组赛BO2 第二场 8.16
2018/08/17 DOTA
python 类详解及简单实例
2017/03/24 Python
浅谈Python 的枚举 Enum
2017/06/12 Python
pycharm激活码快速激活及使用步骤
2020/03/12 Python
Python通过队列来实现进程间通信的示例
2020/10/14 Python
HTML5实现的图片无限加载的瀑布流效果另带边框圆角阴影
2014/03/07 HTML / CSS
美国摄影爱好者购物网站:Focus Camera
2016/10/21 全球购物
LightInTheBox法国站:中国跨境电商
2020/03/05 全球购物
安全承诺书范文
2014/03/26 职场文书
党建工作汇报材料
2014/12/24 职场文书
大学生毕业评语
2014/12/31 职场文书
Python深度学习之实现卷积神经网络
2021/06/05 Python
JavaScript中的LHS和RHS分析详情
2022/04/06 Javascript