ajax 实现城市,区域,道路 下拉列表级联。。主要还是js
<script type="text/javascript">
var xmlHttp;
function createXMLHttp(){
if(window.XMLHttpRequest){
xmlHttp=new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
try{
//Firefox, Opera 8.0+, Safari
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}catch(e){
//Internet Explorer
try{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}catch(e){
xmlHttp = false;
}
}
}
}
function refreshArea(){
var cityid=document.getElementById("cityid").value;
createXMLHttp();
xmlHttp.onreadystatechange = refreshAreaCallback;
var urls="/area/area!findAreaByID.action?formInfo.FCITYID="+cityid;
xmlHttp.open("post",urls);
xmlHttp.send(null);
}
function refreshAreaCallback(){
if(xmlHttp.readyState==4){
if(xmlHttp.status ==200){
var membersData = xmlHttp.responseXML.getElementsByTagName('name');
var fid=xmlHttp.responseXML.getElementsByTagName('fid');
var area=document.getElementById("areaid");
area.innerHTML='';
area.options.add(new Option("--请选择","0"));
for(var i=0;i<membersData.length;i++){
var areaname=membersData[i].firstChild.nodeValue;
var areaid = fid[i].firstChild.nodeValue;
area.options.add(new Option(areaname,areaid));
//js老是提示错误。找了很久,发现这个方法挺好。不知道还有没有更简单的方法
}
}
}
}
function refreshRoad(){
var FAREAID=document.getElementById("areaid").value;
createXMLHttp();
xmlHttp.onreadystatechange = refreshRoadCallback;
var url="/road/road!findRoadByID.action?formInfo.FAREAID="+FAREAID;
xmlHttp.open("post",url);
xmlHttp.send(null);
}
function refreshRoadCallback(){
if(xmlHttp.readyState==4){
if(xmlHttp.status ==200){
var membersData = xmlHttp.responseXML.getElementsByTagName('name');
var fid=xmlHttp.responseXML.getElementsByTagName('fid');
var road=document.getElementById("roadid");
road.innerHTML='';
road.options.add(new Option("--请选择","0"));
for(var i=0;i<membersData.length;i++){
var deptname=membersData[i].firstChild.nodeValue;
var deptid = fid[i].firstChild.nodeValue;
road.options.add(new Option(deptname,deptid));
}
}
}
}
</script>