js 實現(xiàn)級聯(lián)列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>js實現(xiàn)聯(lián)動菜單</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script>
var province_cities = [
["請選擇"],
["濟南","青島","煙臺"],
["杭州","寧波","溫州"],
["南京","無錫","蘇州"]
];
function change(){
var p = document.getElementById("province");
var citices = province_cities[p.value];
var c = document.getElementById("city");
//清空操作
c.innerHTML = "";
for(var i =0;i<citices.length;i++){
var o = document.createElement("option");
o.setAttribute("value",i);
o.innerHTML = citices[i];
c.appendChild(o);
};
};
</script>
</head>
<body>
<p>
<select id = "province" onchange = "change();">
<option value = "0">請選擇</option>
<option value = "1">山東</option>
<option value = "2">浙江</option>
<option value = "3">江蘇</option>
</select>
<select id = "city">
<option value = "0">請選擇</option>
</select>
</p>
</body>
</html>
jQuery 實現(xiàn)級聯(lián)列表
浙公網(wǎng)安備 33010602011771號