- 浏览: 21249 次
- 性别:
- 来自: 北京
最新评论
ajax的使用步骤:
1.需要通过JavaScript创建XMLHttpRequest对象 所有发送的ajax请求和接受服务器传回来的参数都要通过XMLHttpRequest对象来操作
function createXmlHttp(){
if(window.XMLHttpRequest){
//针对firefox,mozillar,opera,safari,IE7,IE8
xmlHttp = new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的bug进行修正
if(xmlHttp.overrideMimeType){
xmlHttp.overrideMimeType("text/xml");
}
}else if(window.ActiveXObject){
//针对IE6,IE5.5,IE5
try{
xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");
}catch(e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
alert("不能创建XmlHttpRequest");
}
}
}
}
2.利用已创建的XMLHttpRequest对象发送请求给服务器
请求是:servlet
通过XMLHttpRequest对象的open(first,second,third)方法设置要发送的请求
First是第一个参数指的是url提交的方式为get或者是post
第二个参数Second指的是发送请求的url 一般为servlet的url-pattern或者jsp页面的
第三个参数为请求的方式为同步还是异步 true代表异步请求
3.利用XMLHttpRequest的onreadystatechange监听XMLHttpRequest对象中readystate的状态 当状态发生改变的时候调用回调函数去讲返回的数据写到页面指定的地方 这里的回调函数不能加上();仅仅是回调函数名即可
4.利用XMLHttpRequest中的send()方法发送请求给服务器
注意:send(null);null代表Firefox和IE都支持
5.需要注意的地方是:回调函数只有在readystate状态为4代表数据接受成功才去操作
此时XMLHttpRequest里面的status状态为200时代表数据接受无误 其他会出现404或者500的错误 返回的数据全部保存到XMLHttpRequest中的responseText中 最后可以将获取的返回数据写到页面指定的位置 实现局部刷新
Status的状态码及含义:
Http状态码 含义
200 请求成功
202 请求被接收,但处理未完成
404 请求资源未找到
500 内部服务器错误
ReadyState的状态值及含义
readyState值 含义
0 表示XMLHttpRequest对象已建立,但还未初始化,这时尚未调用open方法
1 表示open方法已经调用,但未调用send方法(已创建,未发送)
2 表示send方法已经调用,其他数据未知
3 表示请求已经成功发送,正在接受数据
4 表示数据已经成功接收。
以上是get的提交方式的想法 如果是post的提交方式和get方式的不同之处
1. 传参形式不同 get方式通过url后面加?再加传的参数 而post方式参数通过send(参数)传递
2. Post方式在send()之前要加上一句话xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
其他都一样
注意:url的路径问题 一般是servlet对应的url-pattern或者是jsp页面 以及到底包含不包含参数
1.需要通过JavaScript创建XMLHttpRequest对象 所有发送的ajax请求和接受服务器传回来的参数都要通过XMLHttpRequest对象来操作
function createXmlHttp(){
if(window.XMLHttpRequest){
//针对firefox,mozillar,opera,safari,IE7,IE8
xmlHttp = new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的bug进行修正
if(xmlHttp.overrideMimeType){
xmlHttp.overrideMimeType("text/xml");
}
}else if(window.ActiveXObject){
//针对IE6,IE5.5,IE5
try{
xmlHttp=new ActiveXObject("MSXML2.XMLHTTP");
}catch(e){
try{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
alert("不能创建XmlHttpRequest");
}
}
}
}
2.利用已创建的XMLHttpRequest对象发送请求给服务器
请求是:servlet
通过XMLHttpRequest对象的open(first,second,third)方法设置要发送的请求
First是第一个参数指的是url提交的方式为get或者是post
第二个参数Second指的是发送请求的url 一般为servlet的url-pattern或者jsp页面的
第三个参数为请求的方式为同步还是异步 true代表异步请求
3.利用XMLHttpRequest的onreadystatechange监听XMLHttpRequest对象中readystate的状态 当状态发生改变的时候调用回调函数去讲返回的数据写到页面指定的地方 这里的回调函数不能加上();仅仅是回调函数名即可
4.利用XMLHttpRequest中的send()方法发送请求给服务器
注意:send(null);null代表Firefox和IE都支持
5.需要注意的地方是:回调函数只有在readystate状态为4代表数据接受成功才去操作
此时XMLHttpRequest里面的status状态为200时代表数据接受无误 其他会出现404或者500的错误 返回的数据全部保存到XMLHttpRequest中的responseText中 最后可以将获取的返回数据写到页面指定的位置 实现局部刷新
Status的状态码及含义:
Http状态码 含义
200 请求成功
202 请求被接收,但处理未完成
404 请求资源未找到
500 内部服务器错误
ReadyState的状态值及含义
readyState值 含义
0 表示XMLHttpRequest对象已建立,但还未初始化,这时尚未调用open方法
1 表示open方法已经调用,但未调用send方法(已创建,未发送)
2 表示send方法已经调用,其他数据未知
3 表示请求已经成功发送,正在接受数据
4 表示数据已经成功接收。
以上是get的提交方式的想法 如果是post的提交方式和get方式的不同之处
1. 传参形式不同 get方式通过url后面加?再加传的参数 而post方式参数通过send(参数)传递
2. Post方式在send()之前要加上一句话xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
其他都一样
注意:url的路径问题 一般是servlet对应的url-pattern或者是jsp页面 以及到底包含不包含参数
发表评论
-
遮盖层覆盖整个页面
2015-07-08 10:45 553html代码: <body topmargin= ... -
spring注解+restlet
2014-08-26 13:32 605spring注解精解: http://www.douban.c ... -
Spring使用程序方式读取properties文件
2014-07-03 10:37 487Spring使用程序方式读取properties文件 在sp ... -
用javascript取当前系统时间(年、月、日等全)
2013-07-25 14:56 527var myDate = new Date(); myDate ... -
sql--查询数据库的连接数
2013-06-07 14:04 552Oracle: select * from v$sessio ... -
jQuery中设置form表单中action值的方法
2013-04-28 18:16 1084html代码: <form id="myFo ... -
java filter
2013-04-24 23:17 831一、使浏览器不缓存页面的过滤器 Java代码 impo ... -
sql count
2013-04-23 14:33 669连接该服务器的个数: SELECT count(*) FRO ... -
关闭打开页js(兼容浏览器)
2013-04-22 13:17 810<script> function closeSe ... -
sql-修改表
2013-04-11 10:19 646如需在表中添加列,请使用下列语法: ALTER TABLE t ... -
wget 爬虫
2012-11-13 13:34 1416wget 使用指南 wget是一个从网络上自动下载文件的自由工 ... -
Struts2的整理
2012-11-13 13:31 8191、任何表现层框架都是用来帮我们实现MVC model1(js ... -
dwr的使用
2012-11-11 12:38 744Dwr使用说明 1. 将dwr的ja ... -
JAVA数据库连接池
2012-11-09 00:02 693JAVA数据库连接池 基 ... -
事务传播特性和事务隔离级别
2012-11-08 23:48 562事务传播特性了解事务 ... -
ibatis
2012-11-08 23:45 712ibatis: ibatis中dao中的方法在使用sqlMap ... -
懒加载
2012-11-07 19:03 595get和load默认的时候都是立即检索,只有设置lazyloa ... -
HQL语句
2012-11-07 19:01 5791.实体查询 String hql = &qu ... -
类的加载和反射
2012-11-07 18:57 6381. 类的加载、连接和初始 a) 类的加载 i. 当程序主动使 ... -
部分重要SQL语句
2012-11-06 20:13 690TO_CHAR(date, 'fmt') 用于将 ...
相关推荐
使用Ajax实现从服务器读取数据,包括Ajax实现的详细步骤
Ajax使用工具包Ajax使用工具包Ajax使用工具包Ajax使用工具包Ajax使用工具包Ajax使用工具包
掌握Ajax使用 JSON 进行数据传输 掌握Ajax使用 JSON 进行数据传输 掌握Ajax使用 JSON 进行数据传输
Ajax使用示例完整项目代码,参考博客:http://blog.csdn.net/daijin888888/article/details/51208570
Ajax使用jQuery提交表单 文件
提供了四种 ajax使用方式,jquery、prototype、ajaxrequest以及原始版本使用方法及实例demon,以及相关乱码问题等等。
Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包Ajax开发包
ajax使用例子,包括“ajax_xml运用.doc”文档一份,eclipse开发的例子一套。
帮助您方便快捷的掌握Ajax技术,Ajax帮助文档 Ajax使用手册,欢迎下载
ajax使用,实现百度搜索范例,数据为模拟数据,主要实现使用ajax搜索查询
aspnet ajax使用文档(AspNet_AJAX_Documentation)
aspnet ajax使用示例(AspNet_AJAX_Documentation)
Ajax使用POST提交中文乱码问题.docx
DWR使用步骤另附ajax使用基本流程 是word文档
ajax使用jquery json实现的省市县三级联动经验总结
本例子提供给对ajax只是想用而又无从下手的程序员。从过该例的调试初步认识ajax,为以后更好的运用ajax埋下伏笔。
通过DOM和Ajax使用XML_从菜鸟到专家2006
JavaEE5学习笔记12-JSF集成AJAX使用经验总结。