1.什么是AJAX
客户端与服务器,可以在【不必刷新整个浏览器】的情况下,与服务器进行异步通讯的技术,即,AJAX是一个【局部刷新】的【异步】通讯技术;
AJAX不是全新的语言,是2005年Google公司推出的一种全新【编程模式】,不是新的编程语言。
2.AJAX开发步骤
步一:创建AJAX异步对象,例如:createAJAX()
步二:准备发送异步请求,例如:ajax.open(method,url)
步三:如果是POST请求的话,一定要设置AJAX请求头,例如:ajax.setRequestHeader(),如果是GET请求的话,无需设置设置AJAX请求头
步四:真正发送请求体中的数据到服务器,例如:ajax.send()
步五:AJAX不断的监听服务端响应的状态变化,例如:ajax.onreadystatechange,后面写一个无名处理函数
步六:在无名处理函数中,获取AJAX的数据后,按照DOM规则,用JS语言来操作Web页面
3.XMLHttpRequest(AJAX)对象常用事件,方法和属性
事件:
ajax.onreadystatechange:表示AJAX异步对象不断监听服务端的响应,是由服务器程序触发,不是程序员触发
属性:
ajax.readyState==0:表示AJAX异步对象已创建好,但还没有调用open()方法
ajax.readyState==1:表示AJAX异步对象已调用open()方法,但还没有调用send()方法
ajax.readyState==2:表示AJAX异步对象已调用send()方法,但请求还没有到达服务器端
ajax.readyState==3:表示服务端已接收到AJAX异步对象的请求,正在处理响应中。。。
ajax.readyState==【4】:表示AJAX异步对象已经完完全全接收到了服务器的响应信息,但接收到的数据不一定都正确
上述5种状态不是所有浏览器都相同,但状态4每种浏览器都相同
ajax.status==200:表示AJAX异步对象接收到响应码,如果是200的话,表示一切正常
ajax.responseText:表示从AJAX异步对象中获取HTML载体中的数据
ajax.responseXML:表示从AJAX异步对象中获取XML载体中的数据
方法:
ajax.open(method,url,可选的boolean值)
AJAX异步对象准备发送异步请求
参数一:以什么方式发送,常用的用GET或POST,大小写不敏感
参数二:发送到什么地方去,常用Servlet或Struts2或SpringMVC来接收,
参数三:默认值为true,表示AJAX对象以【异步】的方式提交到服务端
如果设置为false,表示AJAX对象以【同步】的方式提交到服务端
ajax.setRequestHeader(“content-type”,”application/x-www-form-urlencoded”)
表示将请求体中的内容,按照UTF-8的方式进行编码,只针对POST请求有效
ajax.send(content)
AJAX异步对象真正发送异步请求
参数一:表示HTTP【请求体】中的内容
如果是GET方式:content = null,如果强行传值到服务器,服务端收不到,返回NULL
如果是POST方式:content != null,例如:username=jack&password=123&role=admin
4.AJAX适合用在什么地方
AJAX【适合】不用来传递大量数据,而只用来【传递少量数据】,在用户的【体验】上,【更加人性化】。
AJAX是一个和服务器无关的技术,即服务器可使用:JavaEE,.NET,PHP……这些技术都可。
AJAX只管向服务器发送请求,同时只管接收服务器的HTML或XML或JSON载体响应。
服务端不能使用转发或重定向到web页面,因为这样会起浏览器全面刷新,即只能以流的方式响应给浏览器。
5.验证用户名是否存在
Action中的方法:(Action中要有相应属性的参数set和get方法)
6.二级联动下拉框(xml方式)
Action中的方法:
7.验证码
生成验证码:
使用验证码:
验证:
struts验证:
原创文章,作者:优速盾-小U,如若转载,请注明出处:https://www.cdnb.net/bbs/archives/30769