JS——二级下拉框

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<select id="province" onchange="province_change()"></select>
	<select id="city"></select>

	<script src="common.js"></script>
	<script>
		var province = ["黑龙江","吉林","辽宁"];

		function loadprovince() {
			var opts = "";
			for(var i=0;i<province.length;i++){
				opts += "<option value="+i+">"+province[i]+"</option>";
			}
			$("province").innerHTML=opts;
		}

		window.onload = function(){  
	        loadProvince(); //加载省份信息  必须有
	        province_change(); // 加载城市信息  可选，如果有的话，提升用户体验
      	}

      	var city = [
				["哈尔滨","齐齐哈尔","牡丹江"],
				["长春","吉林","四平"],
				["沈阳","大连","铁岭"]
		];

		function province_change(){
			var pValue = $("province").value;
			var selCity = city[pValue];
			var opts = "";
			for(var i=0;i<selCity.length;i++){
	          opts+="<option>"+selCity[i]+"</option>";
	        }
	        $("city").innerHTML = opts;
	    }
	</script>
</body>
</html>