这个联级菜单怎么做？

mmrwbb7 2009-12-16 02:14:41

百度知道上的。
地址：http://zhidao.baidu.com/q?fr=idx_0&ct=17&pn=0&tn=ikask&rn=10&word=k&cm=1&lm=394496

有这样的联级菜单吗？？相似的也成。

...全文

160 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

Click_Me 2009-12-16

打赏
举报



<!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>



// 简单写个 可扩展性还不是很好

cloudgamer 2009-12-16

打赏
举报

可以参考一下这个联动select

cntmi 2009-12-16

打赏
举报

var json = {"电脑/网络":{

							"笔记本":{"购买","维修"},

							"台式机":{"购买","维修","装机"},

						

						},

			"生活":		{

							"家电":{},

							"美容":{"减肥","化妆","护肤"},

						

						},		

			

			}

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

mmrwbb7 2009-12-16