标签：style blog http java color 使用
AJAX = Asynchronous JavaScript And XML（异步 JavaScript 及 XML）
AJAX 是 Asynchronous JavaScript And XML 的首字母缩写。
AJAX 并不是一种新的编程语言，而仅仅是一种新的技术，它可以创建更好、更快且交互性更强的 web 应用程序。
AJAX 使用 JavaScript 在 web 浏览器与 web 服务器之间来发送和接收数据。
通过在幕后与 web 服务器交换数据，而不是每当用户作出改变时重载整个 web 页面，AJAX 技术可以使网页更迅速地响应。
接下来做一个用Ajax实现页面单机按钮显示用户是否存在的实例.
XMLHttpRequest对象是Ajax技术的关键,其作用是用于在后台与服务器交换数据.该对象的创建方式如下:
1 function ajaxFunction(){ 2 var xmlReq; 3 try{ 4 xmlReq = new XMLHttpRequest(); 5 }catch(e){ 6 xmlReq = new new ActiveXObject("MSXML2.XMLHTTP.3.0"); 7 } 8 return xmlReq; 9 }
通过XMLHttpRequest对象和服务器交换信息的过程分为5步:
1.获取XMLHttpRequest对象.
2.onreadystatechange 事件:时刻返回相应状态.
3.打开与服务器连接.
4.发送信息给服务器.
5.得到服务器的信息.
具体步骤可查看W3School教程:http://www.w3school.com.cn/ajax/ajax_xmlhttprequest_send.asp
1 window.onload = function(){ 2 document.getElementById("ajax").onclick = function(){ 3 var xmlReq = ajaxFunction(); 4 //onreadystatechange 事件,当返回状态为4时表示成功 5 xmlReq.onreadystatechange = function(){ 6 if(xmlReq.readyState == 4){ 7 if(xmlReq.status == 200 || xmlReq.status == 304){ 8 //得到服务器发送的数据 9 var info = xmlReq.responseText; 10 //页面显示 11 document.getElementById("usernameView").innerHTML = info; 12 } 13 } 14 }; 15 //打开与一个Servlet的交互 16 xmlReq.open("post", "../servlet/AjaxServlet?timeStamp="+new Date().getTime(),true); 17 //设置请求头，这样xmlReq.send()方法发送的数据，服务器才能接受到 18 xmlReq.setRequestHeader("content-type", "application/x-www-form-urlencoded"); 19 20 var username = document.getElementById("username").value; 21 //项服务器发送数据 22 xmlReq.send("username="+username); 23 24 }; 25 };
Servlet用于对传过来的数据进行处理,一般都是查询数据库进行比对,这里只是个Demo,所以没用数据库.
1 package cn.itcast.web.servlet; 2 3 import java.io.IOException; 4 5 import javax.servlet.ServletException; 6 import javax.servlet.http.HttpServlet; 7 import javax.servlet.http.HttpServletRequest; 8 import javax.servlet.http.HttpServletResponse; 9 10 public class AjaxServlet extends HttpServlet { 11 12 public void doGet(HttpServletRequest request, HttpServletResponse response) 13 throws ServletException, IOException { 14 request.setCharacterEncoding("utf-8"); 15 response.setCharacterEncoding("utf-8"); 16 response.setContentType("text/html;charset=utf-8"); 17 //得到请求值 18 String username = request.getParameter("username"); 19 if("sa".equals(username)){ 20 response.getWriter().println("用户名已经存在"); 21 }else{ 22 response.getWriter().println("用户名可用"); 23 } 24 25 } 26 27 public void doPost(HttpServletRequest request, HttpServletResponse response) 28 throws ServletException, IOException { 29 doGet(request, response); 30 } 31 }
1.使用Ajax的最大优点，就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作，并避免了在网络上发送那些没有改变的信息。
2.Ajax不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行.
3.对应用Ajax最主要的批评就是，它可能破坏浏览器的后退功能.
详细信息可查看维基百科:http://zh.wikipedia.org/zh/AJAX
标签：style blog http java color 使用
原文地址：http://www.cnblogs.com/zcj461399501/p/3849760.html
