ajax三级联动

来源:互联网 发布:造字软件在线使用 编辑:程序博客网 时间:2024/06/06 19:18
<script type="text/javascript">    (function(){        var docXMl;        var province;        var citys;        //上面的是Area.xml文件中的        var pro1;        var city1;        var country1;        window.onload=function(){            //异步问题注意            initProvince();            pro1= document.getElementById("province");            pro1.onchange=getCity;            city1=document.getElementById("city");            city1.onchange=getCountry;        }        function getCountry(){            var cityValue=this.value;            var citycs=docXMl.getElementsByTagName("city");            for(var i=0;i<citycs.length;i++) {                if (citycs[i].getAttribute("value") == cityValue) {                    var city2 = citycs[i];                    break;                }            }            var countryss=city2.getElementsByTagName("country");            country1=document.getElementById("country");            country1.options.length=1;            for(var j=0;j<countryss.length;j++){                var element=document.createElement("option");                element.text=countryss[j].getAttribute("name");                element.value=countryss[j].getAttribute("value");                country1.add(element);            }        }        function getCity(){            var proValue=this.value;            for(var i=0;i<province.length;i++){                if(province[i].getAttribute("value")==proValue){                    var pro2=province[i];                    break;                }            }            citys=pro2.getElementsByTagName("city");            city1=document.getElementById("city");            country1=document.getElementById("country");            city1.options.length=1;            country1.options.length=1;            for(var j=0;j<citys.length;j++){                var element=document.createElement("option");                element.text=citys[j].getAttribute("name");                element.value=citys[j].getAttribute("value");                city1.add(element);            }        }        function initProvince(){            var xhr=CreateXmlHttpServlet();            xhr.open("POST","Area.xml",true);            xhr.onreadystatechange=function(){                if(xhr.readyState==4&&xhr.status==200){                   docXMl=xhr.responseXML;                    province=docXMl.getElementsByTagName("province");                    pro1=document.getElementById("province");                    for(var i=0;i<province.length;i++){                        var element=document.createElement("option");                        element.text=province[i].getAttribute("name");                        element.value=province[i].getAttribute("value");                        pro1.add(element);                    }                }            }            xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");            xhr.send();        }        function CreateXmlHttpServlet(){            if(window.XMLHttpRequest){                return new XMLHttpRequest();            }else{                return new ActiveXObject("Microsoft.XMLHTTP");            }        }    })();</script>