码迷,mamicode.com
首页 > Web开发 > 详细

js实现级联菜单(没有后台)

时间:2017-07-29 16:35:30      阅读:163      评论:0      收藏:0      [点我收藏+]

标签:分享   其他   添加内容   inner   code   selected   内容   cte   ges   

技术分享技术分享技术分享

html代码:

<!-- js级联菜单 -->
<div id="cascMenu">
    <select id="select" onchange="getLocal(this.selectedIndex)">
        <option>请选择</option><!-- selectedIndex=0 -->
        <option>北京</option><!-- selectedIndex=1 -->
        <option>上海</option>
        <option>广州</option>
    </select>
    <select id="selectInfo">
        <option>请选择</option>
    </select>
<div>

 

js代码:

function getLocal(selectIndex){
    var arr=new Array();
    arr[0]=[new Option("请选择","1")];
    arr[1]=[new Option("东城区","1"),new Option("西城区","2"),new Option("朝阳区","3")];
    arr[2]=[new Option("黄埔区","1"),new Option("其他区","2")];
    arr[3]=[new Option("海珠区","1"),new Option("天河区","2"),new Option("白云区","3"),new Option("黄浦区","3")];
    var selectInfo=document.getElementById("selectInfo");
    selectInfo.innerHTML="";
  //为子下拉列表添加内容
    for(var i=0;i<arr[selectIndex].length;i++){
        selectInfo.options[i]=arr[selectIndex][i];
    }
}

 

js实现级联菜单(没有后台)

标签:分享   其他   添加内容   inner   code   selected   内容   cte   ges   

原文地址:http://www.cnblogs.com/lixiang1993/p/7256037.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!