当前位置: 首页 > 图文教程 > 网络编程 > JSP > AJAX 自学练习 请求与显示

JSP
Servlet及JSP中的多线程同步问题
使用Ant和Tomcat创建Web应用
如何直接在浏览器内运行SQL命令
Servlet、Jsp中的多国语言显示
html与jsp开发分离技术
通过Jsp发送动态图像
Servlets和JSP Pages最佳实践
学习在JSP中使用JavaBeans
JSP显示内容缓存技巧
应用JDOM处理数据库到XML转换的JSP实现
JSP中tomcat的SQL Server2000数据库连接池的配置
用JSTL实现JSP应用程序快速开发
浅谈4种类型的JDBC驱动程序
怎样设置 JSP 的虚拟目录
Java 中对文件的读写操作之比较
javamail在jsp中调用
jsp中任意文字转Unicode的通用模块
JSP与SQL SERVER的留言本
jspSmartUpload上传下载全攻略
Tomcat5.x中的虚拟主机配置方法

JSP 中的 AJAX 自学练习 请求与显示


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-11   浏览: 58 ::
收藏到网摘: n/a

主要功能输入 城市代码触发发送请求最终返回城市名称。 如下:
request.jsp
复制代码 代码如下:

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script language="javascript"><!--
function GetXmlHttpObject(){
var xmlHttp = null;
try{
xmlHttp = new XMLHttpRequest();
}catch(e){
try{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
function showMsg(str){
xmlHttp = GetXmlHttpObject();
if(xmlHttp == null){
alert ("you browser don't support the ajax");
return;
}
var url = "response.jsp";
url = url + "?q="+ str;
url = url + "&sid ="+ Math.random();
xmlHttp.onreadystatechange = stateChanged;
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
function stateChanged()
{
if(xmlHttp.readyState==4)
{
document.getElementById("city").value = xmlHttp.responseText;
}
}
// --></script>
</head>
<body>
<form name="form1" action="" method="post">
<label >City Code:</label>
<input type="text" name="code" onblur = "showMsg(this.value)" />
<br></br>
<label>City Name:</label>
<input type="text" name="city" id="city" ></input>
</form>
</body>
</html>

response.jsp
复制代码 代码如下:

<%@ page language="java" contentType="text/plain; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ page import="com.lwf.eus.util.*,java.util.*,com.lwf.eus.entity.*,com.lwf.eus.bean.*" %>
<%
String code = request.getParameter("q");
System.out.println(code);
if(code.equals("140"))
out.print("上海");
else if(code.equals("150"))
out.print("北京");
else if(code.equals("160"))
out.print("天津");
else
out.print("未知地");
%>

这里要注意的是由于返回的结果要在文本框中显示,因此在response.jsp中没有<html>等标签,因为测试发现如果有这些标签的话,在cityname文本框中这些标签也会显示。