ajax+邮政编码对应城市-------------另有jquery做法
index.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<script>
var xhr;
//创建一个XMLHttpRequest对象的函数
function createXHR(){
if(window.ActiveXObject){
//ie
//alert("ie");
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
else if(window.XMLHttpRequest){
//火狐、opera
//alert("火狐");
xhr=new XMLHttpRequest();
}
}
//get方式和服务器建立连接
function test(){
createXHR();
var url="servlet/TestServlet?id=1";
xhr.open("get",url,true);//建立了连接
xhr.onreadystatechange=callback;//readyState0-1
xhr.send(null);
}
//post方式和服务器建立连接
function test1(){
createXHR();
var code=document.getElementsByName("code")[0].value;
var url="servlet/TestServlet";
xhr.open("post",url,true);//建立了连接
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.onreadystatechange=callback;//readyState0-1
xhr.send("id="+code);
}
//建立回调函数
function callback(){
if(xhr.readyState==4){
//接收服务器的请求，更新当前的页面，响应给客户
if(xhr.status==200){
var result=xhr.responseText;
//document.getElementById("div1").innerHTML="<font color=red>"+result+"</font>";
var s=result.split(":");
document.getElementsByName("city")[0].value=s[0];
document.getElementsByName("sheng")[0].value=s[1];
}
}
//alert(xhr.readyState+":callback");
}
</script>
</head>
<body>
<!--<div id="div1"></div> -->
邮编:<input type="text" name="code" onblur="test1()"><p>
城市：<input type="text" name="city"/><p>
省份：<input type="text" name="sheng"/>
</body>
</html>
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>
<description>This is the description of my J2EE component</description>
<display-name>This is the display name of my J2EE component</display-name>
<servlet-name>TestServlet</servlet-name>
<servlet-class>servlets.TestServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>TestServlet</servlet-name>
<url-pattern>/servlet/TestServlet</url-pattern>
</servlet-mapping>
<welcome-file-list>
<welcome-file>index.jsp</welcome-file>
</welcome-file-list>
</web-app>
model包中
package model;
public class CodeBean {
private String code;
private String city;
private String pro;
public String getCode() {
return code;
}
public void setCode(String code) {
this.code = code;
}
public String getCity() {
return city;
}
public void setCity(String city) {
this.city = city;
}
public String getPro() {
return pro;
}
public void setPro(String pro) {
this.pro = pro;
}
public CodeBean(String code, String city, String pro) {
this.code = code;
this.city = city;
this.pro = pro;
}
public CodeBean() {
}
}
servlet包中
package servlets;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import model.CodeBean;
public class TestServlet extends HttpServlet {
private Map<String,CodeBean> codes;
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
PrintWriter out = response.getWriter();
String id=request.getParameter("id");//邮编
System.out.println(id);
//具体的请求处理了吧
CodeBean cBean=codes.get(id);
if(cBean!=null){
out.write(cBean.getCity()+":"+cBean.getPro());
}
else{
out.write("null:null");
}
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doGet(request, response);
}
public void init(){
codes=new HashMap<String, CodeBean>();
CodeBean cb1=new CodeBean("100101","dalian","liaoning");
CodeBean cb2=new CodeBean("100102","zhengzhou","henan");
CodeBean cb3=new CodeBean("100103","changchun","jilin");
codes.put(cb1.getCode(), cb1);
codes.put(cb2.getCode(), cb2);
codes.put(cb3.getCode(), cb3);
}
}
另有数据库连接
-- Create table
create table USERS
(
ID NUMBER not null,
NAME NVARCHAR2(20) not null,
PASS NVARCHAR2(20),
EMAIL NVARCHAR2(50),
POWER NVARCHAR2(20)
)
tablespace USERS
pctfree 10
initrans 1
maxtrans 255
storage
(
initial 64
minextents 1
maxextents unlimited
);
-- Create/Recreate primary, unique and foreign key constraints
alter table USERS
add constraint ID_PK primary key (ID)
using index
tablespace USERS
pctfree 10
initrans 2
maxtrans 255
storage
(
initial 64K
minextents 1
maxextents unlimited
);
-- Create table
create table CITY
(
ID NUMBER(4) not null,
NAME NVARCHAR2(20),
SHENG_ID NUMBER(4)
)
tablespace USERS
pctfree 10
initrans 1
maxtrans 255
storage
(
initial 64
minextents 1
maxextents unlimited
);
-- Create/Recreate primary, unique and foreign key constraints
alter table CITY
add constraint CITY_ID_PK primary key (ID)
using index
tablespace USERS
pctfree 10
initrans 2
maxtrans 255
storage
(
initial 64K
minextents 1
maxextents unlimited
);
alter table CITY
add constraint CITY_SHENG_ID_FK foreign key (SHENG_ID)
references SHENG (ID);
-- Create table
create table SHENG
(
ID NUMBER(4) not null,
NAME NVARCHAR2(20)
)
tablespace USERS
pctfree 10
initrans 1
maxtrans 255
storage
(
initial 64
minextents 1
maxextents unlimited
);
-- Create/Recreate primary, unique and foreign key constraints
alter table SHENG
add constraint SHENG_ID_PK primary key (ID)
using index
tablespace USERS
pctfree 10
initrans 2
maxtrans 255
storage
(
initial 64K
minextents 1
maxextents unlimited
);