java的ajax动态加载,Ajax实现动态加载组合框的实例代码

一 province.jsp

var xmlHttp = false; //全局变量，用于记录XMLHttpRequest对象

function createXMLHttpRequest() {

if(window.ActiveXObject) { //Internet Explorer时，创建XMLHttpRequest对象的方法

try {

xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");

} catch(e) {

try { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");

//旧版本的Internet Explorer，创建XMLHttpRequest对象

} catch(e) {

window.alert("创建XMLHttpRequest对象错误"+e);

}

}

} else if(window.XMLHttpRequest) { //mozilla时，创建XMLHttpRequest对象的方法

xmlHttp = new XMLHttpRequest();

}

if(!(xmlHttp)) { //未成功创建XMLHttpRequest对象

window.alert("创建XMLHttpRequest对象异常！");

}

}

//下拉列表项改变时的操作

function proChange(objVal) {

createXMLHttpRequest(); //创建XMLHttpRequest对象

document.getElementById("city").length = 1; //根据ID获取指定元素，并赋值

xmlHttp.onreadystatechange = cityList; //指定onreadystatechange处理函数

var url="CityByXMLServlet?province="+objVal; //请求的URL地址

xmlHttp.open("POST",url,true);

xmlHttp.send(null);

}

function cityList() { //onreadystatechange的处理函数

if(xmlHttp.readyState==4) {

if(xmlHttp.status==200) {

parseXML(xmlHttp.responseXML); //解析服务器返回的XML数据

}

}

}

//解析xml信息，以添加地市

function parseXML(xmlDoc) {

var len = xmlDoc.getElementsByTagName("city");

//获取XML数据中所有的“city”元素对象集合

var _citySel = document.getElementById("city"); //根据ID获取页面中的select元素

for(var i=0;i

var opt = document.createElement("OPTION"); //创建option对象

opt.text = xmlDoc.getElementsByTagName("city")[i].firstChild.data;

//指定新创建元素的text属性值

opt.value = xmlDoc.getElementsByTagName("city")[i].firstChild.data;

//指定新创建元素的value属性值

_citySel.add(opt); //为select元素添加option

}

}

动态加载组合框

省份：	广东 广西 湖南 湖北 安徽
城市：	--请选择--

二、CityByXMLServlet.java

package servlet;

import java.io.IOException;

import java.io.PrintWriter;

import java.util.*;

import javax.servlet.ServletException;

import javax.servlet.annotation.WebServlet;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

/**

* Servlet implementation class CityByXMLServlet

*/

@WebServlet("/CityByXMLServlet")

public class CityByXMLServlet extends HttpServlet {

private static final long serialVersionUID = 1L;

private static final String CONTENT_TYPE = "text/xml; charset=UTF-8";

/**

* @see HttpServlet#HttpServlet()

*/

public CityByXMLServlet() {

super();

// TODO Auto-generated constructor stub

}

/**

* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)

*/

public void doGet(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

response.setContentType(CONTENT_TYPE); //设置服务器响应类型

String province =request.getParameter("province");

StringBuffer city = new StringBuffer(""); //记录返回XML串的对象

if("gx".equals(province)){

List list=cityInit(); //获取城市列表

for(int i=0;i

city.append(""+list.get(i)+"");

}

}else if("hn".equals(province)){

List list = cityInit1(); //获取城市列表

for(int j=0;j

city.append(""+list.get(j)+"");

}

}else if("hb".equals(province)){

List list = cityInit2(); //获取城市列表

for(int j=0;j

city.append(""+list.get(j)+"");

}

}

city.append("");

PrintWriter out = response.getWriter();

out.println(city.toString());

out.flush(); //输出流刷新

out.close(); //关闭输出流

}

/*

* 初始化城市

*/

public List cityInit2() {

List cityList = new ArrayList();

//添加城市列表

cityList.add("武汉");

cityList.add("襄阳");

cityList.add("黄冈");

cityList.add("荆门");

cityList.add("十堰");

cityList.add("黄石");

return cityList;

}

public List cityInit(){

List cityList = new ArrayList();

//添加城市列表

cityList.add("南宁");

cityList.add("桂林");

cityList.add("北海");

cityList.add("河池");

cityList.add("梧州");

cityList.add("玉林");

return cityList;

}

public List cityInit1() {

List cityList = new ArrayList();

//添加城市列表

cityList.add("长沙");

cityList.add("湘潭");

cityList.add("岳阳");

cityList.add("常德");

cityList.add("衡阳");

cityList.add("邵阳");

return cityList;

}

/**

*当前Servelt的初始化方法.

*

* @throws ServletException发生ServletExceptio时抛出

*/

public void init() throws ServletException {

}

protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

doGet(request, response);

}

}

三 web.xml

CityByXMLServlet

servlet.CityByXMLServlet

CityByXMLServlet

/CityByXMLServlet

总结

以上所述是小编给大家介绍的Ajax实现动态加载组合框的实例代码，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！