这个联级菜单怎么做？


百度知道上的。
地址：http://zhidao.baidu.com/q?fr=idx_0&ct=17&pn=0&tn=ikask&rn=10&word=k&cm=1&lm=394496
有这样的联级菜单吗？？相似的也成。

解决方案 »

  1.   

    这种菜单，其实跟select 的级联菜单是一样的
    采用的是JS的数组套数组的模式
      

  2.   

    var json = {"电脑/网络":{
    "笔记本":{"购买","维修"},
    "台式机":{"购买","维修","装机"},

    },
    "生活": {
    "家电":{},
    "美容":{"减肥","化妆","护肤"},

    },

    }你就写成这种格式就可以了
      

  3.   

    可以参考一下这个联动select
      

  4.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
      <style>
    select {
    width: 80px;
    margin-left: 20px;
    }
      </style>
     </head>
     <body>
    <select id="fir" size="20"></select>→<select id="sec" size="20"></select>→<select id="thi" size="20"></select>
    <script>
    var Fir = ['电脑/网络', '生活', '医疗健康', '体育运动', '电子数码'];
    var Sec= [
    ['不选', '电脑', '网络'],
    ['不选', '生活分支'], 
    ['不选', '医疗分支'], 
    ['不选', '体育分支'],
    ['不选', '手机通讯', '照相机/摄像机', 'MP4/MP3']
      ];var Thi = [
    [
    ['无'],
    ['电脑一', '电脑二', '电脑三'],
    ['网络一', '网络二', '网络三']
    ],
    [
    ['无'],
    ['生活分支一', '生活分支二']
    ],
    [
    ['无'],
    ['医疗分支一', '医疗分支二']
    ],
    [
    ['无'],
    ['体育分支一', '体育分支二']
    ],
    [
    ['无'],
    ['手机购买', '手机使用', '通讯服务'],
    ['尼康', '佳能'],
    ['苹果', '爱国者', '索尼']
    ]
      ]; var List = function(){
    var $ = function(){
    return document.getElementById(arguments[0]);
    };
    var addEvent = function(a, b, c) {
    a.addEventListener ? a.addEventListener(b, c, false) : a.attachEvent('on'+b, c);
    };
    var getSelText = function(osel) {
    return osel.options[osel.selectedIndex].text;
    };
    var fir = $('fir'), sec = $('sec'), thi = $('thi'); var createOpt =  function(osel, arr, index){
    osel.options.length = len =  arr.length;
    for(var i = 0; i < len; i++) {
    osel.options[i].text = osel.options[i].value = arr[i];
    }
    osel.selectedIndex = index || 0;
    };

    var changeFir = function(){
    createOpt(sec, Sec[fir.selectedIndex]);
    createOpt(thi, Thi[fir.selectedIndex][sec.selectedIndex]);
    }; var changeSec = function(){
    createOpt(thi, Thi[fir.selectedIndex][sec.selectedIndex]);
    };
    return {
    init: function(){
    createOpt(fir, Fir);
    createOpt(sec, Sec[0]);
    createOpt(thi, Thi[0][0]);
    this.bindEvents();
    },
    bindEvents: function(){
    var _this = this;
    addEvent(fir, 'change', changeFir);
    addEvent(sec, 'change', changeSec);
    }
    }
    }();
    List.init();
    </script>
    </body>
    </html>// 简单写个 可扩展性还不是很好