html select联动
时间: 2023-07-19 07:25:50 浏览: 52
HTML select联动指的是当一个select元素的选项被选择时,另一个select元素的选项会相应地发生变化。这种联动可以通过JavaScript来实现。
以下是一个简单的例子:
```html
<select id="province" onchange="updateCities()">
<option value="beijing">北京</option>
<option value="shanghai">上海</option>
</select>
<select id="city"></select>
<script>
function updateCities() {
var provinceSelect = document.getElementById("province");
var citySelect = document.getElementById("city");
var provinceValue = provinceSelect.options[provinceSelect.selectedIndex].value;
// 根据省份的值更新城市的选项
if (provinceValue === "beijing") {
citySelect.innerHTML = '<option value="dongcheng">东城</option><option value="xicheng">西城</option>';
} else if (provinceValue === "shanghai") {
citySelect.innerHTML = '<option value="pudong">浦东</option><option value="minhang">闵行</option>';
}
}
</script>
```
在上面的例子中,当用户选择省份时,相应的城市选项会更新。updateCities函数会获取选择的省份值,并根据该值更新城市选项的innerHTML。当用户选择不同的省份时,城市选项会相应地改变。