Ajax_典型应用_2级联动__城市到部门的 Ajax 实现

2017-01-06 07:56:43来源:CSDN作者:fanpengfei0人点击

<%@ 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=ISO-8859-1"><title>Insert title here</title><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery-1.7.2.js"></script><script type="text/javascript" src="${pageContext.request.contextPath}/js/jquery.blockUI.js"></script><script type="text/javascript">	$(function(){		$(document).ajaxStart($.blockUI).ajaxStop($.unblockUI);				$("#city").change(function(){			$("#department option:not(:first)").remove();			var city=$(this).val();						if(city!=""){				var url="/employeeServlet";				var args={"locationId":city,"time":new Date()};				$.getJSON(url,args,function(data){					if(data.length==0){						alert("no department");					}else{						for(var i=0;i<data.length;i++){							var deptId=data[i].departmentId;							var deptName=data[i].departmentName;							$("#department").append("<option value='"+deptId+"'>"+deptName+"</option>")						}					}				});			}		});	});</script></head><body><center>	<br><br>	City:	<select id="city">		<option value="">choose...</option>		<option value="hello">world</option>		<c:forEach items="${locations }" var="location">			<option value="${location.locationId }">${location.city }</option>		</c:forEach>	</select>	  	Department:	<select id="department">		<option value="">choose ...</option>	</select>	<br><br></center></body></html>


jquery.blockUI.js 下载地址:

http://download.csdn.net/detail/fanpengfei0/9730183


最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台