<!DOCTYPE html>
<html>
<head>
<title>二级联动下拉列表</title>
<meta charset="utf-8">
</head>
<body>
<form name="lineandstation">
线路选择:
<select name="lines" id="lines" onchange="getStationName()">
<option value="0">请选择线路</option>
</select> 站点选择：
<select name="station">
<option value="0">请选择车站</option>
</select>
</form>
</body>
<script type="text/javascript">
var lineNum = ["101", "102"];
var collect = document.getElementById("lines")
var old = collect.innerHTML
function load() {
var lineNu = "";
for (var j = 0; j < lineNum.length; j++) {
lineNu += '<option>' + lineNum[j] + '</option>';
}
collect.innerHTML = old + lineNu;
} //网页加载时执行此函数，为线路选择框动态添加选项
load();
var stationName = [
["1", "2", "3", "4", "5"],
["11", "22", "33", "44","55"]
];
function getStationName() {
var line_num = document.lineandstation.lines;
var station_name = document.lineandstation.station;
var lineStation = stationName[line_num.selectedIndex - 1];
station_name.length = 1;
for (var i = 0; i < lineStation.length; i++) {
station_name[i + 1] = new Option(lineStation[i], lineStation[i]);
}
} //为站点选择框根据线路选择框的值动态添加选项
</script>
</html>二级联动的下拉列表
最新推荐文章于 2024-05-15 17:12:27 发布
431
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
