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

JSP
jsp计数器制作
用jsp编写文件上载
基于JSP的动态网站开发技术
JSP由浅入深(3)—— 通过表达式增加动态内容
JSP由浅入深(5)—— Scriptlets和HTML的混合
JSP由浅入深(1)—— 熟悉JSP服务器
JSP由浅入深(12)—— 表单编辑
JSP由浅入深(11)—— 标记库
JSP由浅入深(10)—— Beans and Forms处理
JSP由浅入深(9)—— JSP Sessions
JSP由浅入深(8)—— JSP Tags
JSP由浅入深(6)—— JSP声明
JSP由浅入深(4)—— Scriptlets
JSP由浅入深(2)—— 第一个JSP
JSP由浅入深(7)—— JSP Directives
JSP中的字符替换函数 str_replace() 实现!
把一张图片变形扭曲成各种不同的长宽
用JSP编写通用信息发布程序
Java Servlet及Cookie的使用
Apache+Servlet+Jsp环境设置(上)

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


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-11   浏览: 96 ::
收藏到网摘: 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文本框中这些标签也会显示。