javascript实现动态关联菜单

最新推荐文章于 2023-10-30 22:59:42 发布

xuanner

最新推荐文章于 2023-10-30 22:59:42 发布

阅读量1k

点赞数

分类专栏： JavaScript 文章标签： javascript border function table html

本文链接：https://blog.csdn.net/xuanner/article/details/1482243

版权

JavaScript 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

<HTML>

<HEAD>

function setcity() {

switch (document.shengshi.sheng.value) {
  case '河北' :
  var labels = new Array("石家庄","沧州","唐山");
  var values = new Array("sjz","cz","ts");
  break;
  case '山东' :
  var labels = new Array("济南","青岛","烟台");
  var values = new Array("jn","qd","yt");
  break;
}
// 清空市列表选择框的内容
document.shengshi.city.options.length = 0;
// 从数组中添加内容
  for(var i = 0; i < labels.length; i++) {
  document.shengshi.city.add(document.createElement("OPTION"));
  document.shengshi.city.options[i].text=labels[i];
  document.shengshi.city.options[i].value=values[i];
}

// 选择第一个选项

document.shengshi.city.selectedIndex = 0;

}
</SCRIPT>
</HEAD>
<BODY>
<FORM NAME="shengshi">
<table name="tbl" border="1">
<tr>
<td>省:</td>

<td><SELECT NAME="sheng" OnChange="setcity()">
<OPTION VALUE="河北">河北</OPTION>
<OPTION VALUE="山东" SELECTED>山东</OPTION>
</SELECT></td>
<td>市:</td>
<td><SELECT NAME="city"></SELECT></td>
</tr>
</table>
</FORM>

<SCRIPT LANGUAGE="JavaScript">
setcity();
</SCRIPT>
</BODY>
</HTML>

xuanner

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
javascript实现动态关联菜单

function setcity() { switch (document.shengshi.sheng.value) { case 河北 : var labels = new Array("石家庄","沧州","唐山"); var values = new Array("sjz","cz","ts"); break; case 山东 : v
复制链接

扫一扫

专栏目录