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>
阅读全文
0 0
- ajax做三级联动
- ajax做三级联动
- Ajax三级联动
- ajax知识点-三级联动
- AJAX实现三级联动
- AJAX三级联动
- ajax三级联动
- 三级联动AJAX
- jquery ajax 三级联动
- Ajax实现三级联动
- ajax三级联动
- jQuery Ajax三级联动
- ajax省市区三级联动
- ajax三级联动菜单
- Ajax三级联动
- ajax省市区三级联动
- ajax三级省联动
- ajax三级联动
- 页面输入框js正则验证输入值为数字,且只保留小数点后四位
- Codevs1082 线段树练习三(树状数组)
- 九度1459:Prime ring problem
- 在win10下安装keras
- 新手归来——提交状态
- ajax三级联动
- Mongo DBRef 存储
- File类的相关操作方法及使用
- Python判断IP地址格式是否合法
- 设计模式之建造者模式
- 对基于Servlet+JSP+JavaBean开发模式的用户登录注册的升级
- 【SVN】提交文件时,文件被锁定,重启也无法提交的问题
- 一个简单的监控系统的设计
- cocos2d-lua ScaleTo函数细节问题