js 级联菜单

最新推荐文章于 2022-05-06 17:54:47 发布

IT开发者

最新推荐文章于 2022-05-06 17:54:47 发布

阅读量1.2k

点赞数

本文链接：https://blog.csdn.net/yuncode/article/details/7976416

版权

 
源代码：http://yuncode.net/code/c_5051c06d80ad295
 
01
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
 02<html xmlns="http://www.w3.org/1999/xhtml">
 
 03<head> 
 
 04<title>js 级联菜单</title> 
 
 05<style type="text/css">
 
 06#Select2 { 
 
 07    width: 120px;
 
 08}
 
 09#Select1 { 
 
 10    width: 100px;
 
 11} 
 
 12</style> 
 
 13<script type="text/javascript"language="javascript">
 
 14    vararr = newArray([ "河南省","1", "开封市",  "南阳市","安阳市", "郑州市" ], [ "山东省",  
 
 15            "2","济南市", "日照市",  "潍坊市","菏泽市" ], 
 
 16            ["广东省", "3",  "广州市","珠海市", "深圳" ], [  "吉林省", "4","大连市", "沈阳市",  
 
 17                    "哈尔滨市","冰城" ]); 
 
 18    functionshengshi() { 
 
 19        for( var i = 0; i < arr.length; i++) { 
 
 20            document.getElementById("Select2").options.add(newOption( 
 
 21                    arr[i][0], arr[i][1]))
 
 22        }
 
 23        ;
 
 24    }
 
 25    functiongetCity() { 
 
 26        document.getElementById("Select1").options.length = 1;
 
 27        vark = document.getElementById("Select2").value - 1;
 
 28        for( var j = 2; j < arr[k].length; j++) { 
 
 29            document.getElementById("Select1").options.add(newOption( 
 
 30                    arr[k][j], arr[k][j]))
 
 31        }
 
 32    }
 
 33</script> 
 
 34</head> 
 
 35<body onload="shengshi()">
 
 36<p>所在省： 
 
 37  <select id="Select2"name="D2" onchange="getCity()">
 
 38    <option></option>
 
 39  </select>
 
 40  所在市：
 
 41  <select id="Select1"name="D1">
 
 42    <option></option>
 
 43  </select>
 
 44</p> 
 
 45</body> 
 
 46</html>