现在的位置: 网页制作教程＞ JS网页特效＞正文

JS三级联动下拉菜单实例

发表于2016/11/25 ⁄ JS网页特效 ⁄ 0条评论 ⁄ 热度 2,191℃

本实例列出了利用js实现的几种不同的三级联动下拉菜单，自动选择赋值，兼容各浏览器。

三级联动菜单

<SCRIPT LANGUAGE="JavaScript">
  ");
  document.writeln("<\/script>");
  document.writeln("<s"+"cript language=\"JavaScript\">");
  document.writeln("");
  document.writeln("<\/script>");
  }
  //-->
  </script>
<SCRIPT LANGUAGE="JavaScript">
  
  </SCRIPT>
<FORM name="HwForm">
  <HR>选择一次<br>
  <SCRIPT LANGUAGE="JavaScript">
  CreateSelect("","S_13|S_23|S_33","","请选择地区@|请选择省份@|请选择城市@",AllStr1,0);
  </SCRIPT>
<HR>选择三次<br>
  <SCRIPT LANGUAGE="JavaScript">
  CreateSelect("HwForm","S_1|S_2|S_3","华北地区|山东|济宁","请选择地区@|请选择省份@|请选择城市@",AllStr1,3);
  </SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
  
  </SCRIPT>
<HR>选择二次<br><SCRIPT LANGUAGE="JavaScript">
  CreateSelect("HwForm","S_11|S_21|S_31","笔记本|IBM|T42","请选择分类@|请选择品牌@|请选择系列@",AllStr2,2);
  </SCRIPT>

<HR>选择二次<br><SCRIPT LANGUAGE="JavaScript">
  CreateSelect("HwForm","S_12|S_22|S_32","","请选择分类@|请选择品牌@|请选择系列@",AllStr2,1);
  </SCRIPT>
  </FORM>
  <p>查找更多代码，请访问：<a href="http://www.webym.net/jiaocheng/" target="_blank">网站制作教程</a></p>

运行代码提示：您可以先修改部分代码再运行。

运行代码后，可以试试选择一级菜单后，二级和三级出现的几种不同情况。

声明:如需转载，请注明来源于www.webym.net并保留原文链接：http://www.webym.net/jiaocheng/255.html