<head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" /> <title>面向对象</title> <meta name="keywords" content="关键字列表" /> <meta name="description" content="网页描述" /> <link rel="stylesheet" type="text/css" href="" /> <script> //定义省得相关信息 var sheng=[‘请选择‘,‘广东省‘,‘湖南省‘,‘湖北省‘]; //定义是的相关信息 var shi = [[],[‘广州市‘,‘东莞市‘,‘珠海市‘],[‘长沙市‘,‘株洲市‘,‘湘潭市‘],[‘武汉市‘,‘宜昌市‘,‘荆门市‘]]; //封装一个DOM对象 function $(id){ return document.getElementById(id); } function createSheng(){ //遍历一维数组 for(var i in sheng){ //定义op对象 var op=new Option(sheng[i],i); //追加元素到下拉列表 $(‘sheng‘).options.add(op); } } function createShi(){ //获取省得索引信息 var index=$(‘sheng‘).selectedIndex; //清除市的下拉选框 $(‘shi‘).length=0; //遍历市的相关信息 for(var i in shi[index]){ var op =new Option(shi[index][i],i); //追加元素 $(‘shi‘).options.add(op); } } //定义一个window.onload事件 window.onload=function(){ createSheng(); //触发事件 $(‘sheng‘).onchange=createShi; } </script> </head> <body> <select id=‘sheng‘></select> <select id=‘shi‘></select> </body> </html>
原文:http://www.cnblogs.com/IT-Computer-TcpIp/p/4951696.html