java ajax教程_AJAX Java

AJAX Java

需求：完成一个异常获取后台服务器的当前时间。

一、页面制作一个按钮

当前服务器的时间为：

二、编写JS异步提交请求后台

window.onload = function(){

document.getElementById("btn").onclick = function(){

//异步方式请求后台

//以下为AJAX的开发步骤

//关键点：依靠JS的对象，称之为异步对象

//1.创建异步对象

var ajax = null;

try{

//IE浏览器(低版本)

ajax = new ActiveXObject("microsoft.xmlhttp");

}catch(e){

//非IE浏览器或者IE高版本

ajax = new XMLHttpRequest();

}

//2.设置参数

//参数一：请求方式 GET/POST

//参数二：请求地址

ajax.open("GET","${pageContext.request.contextPath}/ShowTime");

//3.发送异步请求

//参数：请求正文的内容

ajax.send(null);

//4.监听服务器的状态

// 请求状态 ： readyState属性 4：代表请求完全到达服务器，并且服务器成功接收了

// 响应状态： status 属性 200: 代表服务器成功地发送了响应数据

ajax.onreadystatechange = function(){

if(ajax.readyState==4 && ajax.status==200){

//5.接收服务器的数据 responseText：接收服务器的数据

var data = ajax.responseText;

//6.利用DOM编程刷新局部的页面

document.getElementById("time").innerHTML = data;

}

};

};

};

三、编写一个ShowTime的Servlet程序

/**

* @author http://www.yiidian.com

*

*/

//异步请求的后台代码

public class ShowTime extends HttpServlet {

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

System.out.println("进入了后台");

// 1.生产一个服务器的时间

SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss");

String curDate = sdf.format(new Date());

//2.异步请求下如何返回数据给页面？ 答案是：必须直接返回字符串

PrintWriter out = response.getWriter();

out.write(curDate);

}

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

doGet(request, response);

}

}

注意，异步请求的后台必须要返回字符串给前台。

四、在web.xml配置Servlet程序

ShowTime

com.yiidian.ShowTime

ShowTime

/ShowTime

五、运行效果

点击按钮，显示服务器时间。