Posted on 2010-10-05 00:29
石子路口 阅读(1876)
评论(0) 编辑 收藏 所属分类:
网页制作 、
网络教学资源平台
刚开始学习ajax,选择了ajax和servlet的整合,初学者可参考,下面上代码。
ajax.jsp:

<%
@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>ajax测试</title>
</head>

<body>


<script type="text/javascript">
function ajaxFunction()

{
var xmlHttp;
try

{
//Fiexfox, Opera 8.0+, safari
xmlHttp = new XMLHttpRequest();
}
catch(e)

{
//ie
try

{
xmlHttp = new ActiveXObject("Msxm12.XMLHTTP");
}
catch(e)

{
try

{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)

{
alert("您的浏览器不支持AJAX! ");
return false;
}
}
}
xmlHttp.onreadystatechange = function()

{
if(xmlHttp.readyState == 4)

{
//document.myForm.time.value = xmlHttp.responseText;
var text = xmlHttp.responseText;
var strings = text.split(",");
var name = strings[0];
var number = strings[1];
document.myForm.name.value = name;
document.myForm.time.value = number;
setTimeout("load()", 1000);
}
}
xmlHttp.open("GET","servlet/getInfo",true);
xmlHttp.send(null);
}
</script>
<form name="myForm">
<table align="center">
<tr><td colspan="2"><input type="text" onblur="ajaxFunction();" value="从本文本框失去焦点则触发ajax" size="30" style="color:red;"/> </td></tr>
<tr>
<td>名称: </td>
<td><input type="text" name="name" /></td>
</tr>
<tr>
<td>数量: </td>
<td><input type="text" name="time" /></td>
</tr>
</table>
</form>
</body>
</html>

GetInfo.java(servlet):
1
package servlet;
2
3
import java.io.IOException;
4
import java.util.Random;
5
6
import javax.servlet.ServletException;
7
import javax.servlet.http.HttpServlet;
8
import javax.servlet.http.HttpServletRequest;
9
import javax.servlet.http.HttpServletResponse;
10
11
public class GetInfo extends HttpServlet
12

{
13
@Override
14
public void doGet(HttpServletRequest req, HttpServletResponse resp)
15
throws ServletException, IOException
16
{
17
resp.setContentType("text/xml;charset=utf-8");
18
resp.setCharacterEncoding("utf-8");
19
resp.setHeader("Cache-Control", "no-cache");
20
String name[] =
{"java程序设计","数据库基础","软件工程"};
21
22
String str = name[new Random().nextInt(name.length)] + "," + new Random().nextInt(1000);
23
System.out.println("字符串: " + str);
24
25
resp.getWriter().write(str);
26
resp.getWriter().flush();
27
}
28
29
@Override
30
public void doPost(HttpServletRequest req, HttpServletResponse resp)
31
throws ServletException, IOException
32
{
33
// TODO Auto-generated method stub
34
doGet(req, resp);
35
}
36
}
37
web.xml:
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">

<servlet>
<servlet-name>getInfo</servlet-name>
<servlet-class>servlet.GetInfo</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>getInfo</servlet-name>
<url-pattern>/servlet/getInfo</url-pattern>
</servlet-mapping>

<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>

运行结果截图: