html下拉框之间的联动------一级分类和二级分类

最新推荐文章于 2024-08-02 16:04:15 发布

涛歌依旧

最新推荐文章于 2024-08-02 16:04:15 发布

阅读量4.7w

点赞数 9

分类专栏： S1: Web

本文链接：https://blog.csdn.net/stpeace/article/details/50743321

版权

S1: Web 专栏收录该内容

133 篇文章 57 订阅

订阅专栏

html/js代码如下：

<html>
<body>

<select id="first" onChange="change()">
   <option selected="selected">湖北</option>
   <option>广东</option>
</select>

<select id="second">
   <option>黄冈</option>
   <option selected="selected">武汉</option>
</select>


<script>
function change()
{
   var x = document.getElementById("first");
   var y = document.getElementById("second");
   y.options.length = 0; // 清除second下拉框的所有内容
   if(x.selectedIndex == 0)
   {
		y.options.add(new Option("黄冈", "0"));
		y.options.add(new Option("武汉", "1", false, true));  // 默认选中省会城市
   }

   if(x.selectedIndex == 1)
   {
		y.options.add(new Option("深圳", "0"));
		y.options.add(new Option("广州", "1", false, true));  // 默认选中省会城市
		y.options.add(new Option("肇庆", "2"));
   }

}
</script>
  
</body>
</html>