多级级联菜单

<script type="text/javascript"> // // Data 实际应用时将把此段作为js脚本单独存放在.js文件中,由于blog过滤尖括号,特做了一些额外处理 //一级数组 var D0 = new Array('("河南","hn")','("河北","hb")','("浙江","zj")'); //二级数组 var D1_0 = new Array('("郑州","zz")','("南阳","ny")'); var D1_1 = new Array('("河北1","hb1")','("河北2","hb2")'); var D1_2 = new Array('("杭州","hz")'); //三级数组 var D2_0_0 = new Array('("二七区","0")','("新郑","hb")'); var D2_0_1 = new Array('("全部","-1")'); var D2_1_0 = new Array('("河北1-1","0")','("河北1-2","hb")'); var D2_1_1 = new Array('("河北2_1","0")'); var D2_2_0 = new Array('("西湖区","0")','("萧山区","hb")'); var defaultSettings = "河南==hn==0==郑州==zz==0==二七区==eq==0==预留==us"; //Function var bFamSwitch = false; var av = navigator.appVersion; var an = navigator.appName; var ua = navigator.userAgent; var nVer = parseInt(av); var isIE = eval(av.indexOf("MSIE") + decodeURI("%3E") + '-1'); var isOpera = eval(av.indexOf("Opera") + decodeURI("%3E") + '-1'); var isMac = eval(ua.indexOf("Macintosh") + decodeURI("%3E") + '-1'); var isNav = eval(an.indexOf("Netscape") + decodeURI("%3E") + '-1'); if ( isOpera ) isNav=false; if ( isMac ) isNav = false; var jsOK = (isIE || isNav); var sC_1 = defaultSettings; //var sC_1 = isIE ? window.name : unescape(document.cookie); // ??? //I0 ( sC_1.indexOf("newDesktops") &amp;amp;amp;amp;amp;lt; 0 || sC_1=="" ) // sC_1 = defaultSettings; function parseSC() { var s = sC_1.substring(0,sC_1.indexOf("==")); sC_1 = sC_1.substring(sC_1.indexOf("==")+2,sC_1.length); return s; } var T0 = parseSC(); var V0 = parseSC(); var I0 = parseSC(); var T1 = parseSC(); var V1 = parseSC(); var I1 = parseSC(); var T2 = parseSC(); var V2 = parseSC(); var I2 = parseSC(); var D = parseSC(); //var Z = V0 + V1; function setSelections() { D = "newDesktops"; T0 = document.Form1.selLev0.options[document.Form1.selLev0.selectedIndex].text; V0 = document.Form1.selLev0.options[document.Form1.selLev0.selectedIndex].value; I0 = document.Form1.selLev0.selectedIndex; T1 = document.Form1.selLev1.options[document.Form1.selLev1.selectedIndex].text; V1 = document.Form1.selLev1.options[document.Form1.selLev1.selectedIndex].value; I1 = document.Form1.selLev1.selectedIndex; T2 = document.Form1.selLev2.options[document.Form1.selLev2.selectedIndex].text; V2 = document.Form1.selLev2.options[document.Form1.selLev2.selectedIndex].value; I2 = document.Form1.selLev2.selectedIndex //sC_1 = T2+"=="+V2+"=="+I2+"=="+D+"=="+T0+"=="+V0+"=="+I0+"=="+T1+"=="+V1+"=="+I1+"=="; //isIE ? window.name = sC_1 : document.cookie = escape(sC_1); } function dw(s) { document.write(s); } //将数组转换为option function fillOptionsWithArray( array ) { for ( i = 0; eval(i + decodeURI("%3c") + array.length); i++ ) { document.write( decodeURI("%3c") + "option" + decodeURI("%3E") + array[i].substr( 0, array[i].length-8 ) + decodeURI("%3c") + "/option" + decodeURI("%3E") ); } } function popLevel0() { var inForm = document.Form1; inForm.selLev0.length = 0; for ( var i=0; eval(i + decodeURI("%3c") + D0.length); i++ ) { eval("inForm.selLev0.options[i]=" + "new Option" + D0[i]); } inForm.selLev0.selectedIndex = I0; } //level 0 function fillLevel0() { //将1级数组输出 fillOptionsWithArray( D0 ); } function popLevel1(famId) { var inForm = document.Form1; var selLev1s = eval("D1_" + famId); inForm.selLev1.length = 0; for ( var i=0; eval(i + decodeURI("%3c") + selLev1s.length); i++ ) { eval("inForm.selLev1.options[i]=" + "new Option" + selLev1s[i]); } inForm.selLev1.options.selectedIndex = I1; } function fillLevel1( famId ) { var selLev1s = eval("D1_" + famId); fillOptionsWithArray( selLev1s ); } function chgLevel0(selLev0Id) { var inForm = document.Form1; var selLev1Array = eval("D1_" + selLev0Id); inForm.selLev1.length = 0; for ( var i=0; eval(i + decodeURI("%3c") + selLev1Array.length); i++ ) { eval("inForm.selLev1.options[i]=" + "new Option" + selLev1Array[i]); } inForm.selLev1.options.selectedIndex = I1; setSelections(); popLevel2(I0,I1); } function popLevel2(V0,V1) { var inForm = document.Form1; var osArray = eval("D2_" + V0 + "_" + V1); inForm.selLev2.length = 0; for ( var k=0; eval(k + decodeURI("%3c") + osArray.length); k++ ) { eval("inForm.selLev2.options[k] = " + "new Option" + osArray[k]); } inForm.selLev2.options.selectedIndex = I2; //for ( var j=0; eval(j + decodeURI("%3c") + inForm.selLev2.options.length); j++ ) //{ // if ( inForm.selLev2.options[j].text == T2 ) // { // inForm.selLev2.options[j].selected=true; // } //} } function fillLevel2(V0,V1) { var osArray = eval("D2_" + V0 + "_" + V1); fillOptionsWithArray( osArray ); } //最后1级 function clickLevel2() { setSelections(); } //第2级 function clickLevel1() { //根据上一级和本级的选项确定下一级 I2 = 0;//先将本级一下的索引设为0 popLevel2(document.Form1.selLev0.selectedIndex,document.Form1.selLev1.selectedIndex); setSelections(); } function clickLevel0() { //先将本级一下的索引设为0 I2 = 0; I1 = 0; chgLevel0(document.Form1.selLev0.selectedIndex); setSelections(); } </script>分析常见的级联菜单算法后,对复杂度和效率进行了折衷。
1。静态级联,适合于不经常更新的数据,比如省市级联菜单
2。数据绑定,使用数据源进行绑定显示。
  • DataSet/DataTable/DataCollect 数据源
  • XML数据源
3.xmlhttp读取xml文件或webservice加载数据
<script type="text/javascript"> dw(decodeURI("%3c") + 'select name="selLev0" SIZE=1 OnChange="clickLevel0()"'+decodeURI("%3E") ); fillLevel0(); dw(decodeURI("%3c") + '/select'+decodeURI("%3E") ); popLevel0(); dw(decodeURI("%3c") + 'select name="selLev1" size=1 OnChange="clickLevel1()"&amp;amp;amp;amp;amp;gt;'); fillLevel1(I0); dw(decodeURI("%3c") + '/select'+decodeURI("%3E") ); popLevel1(I0); dw(decodeURI("%3c") + 'select name="selLev2" size=1 OnChange="clickLevel2()"&amp;amp;amp;amp;amp;gt;'); fillLevel2(I0,I1); dw(decodeURI("%3c") + '/select'+decodeURI("%3E") ); popLevel2(I0,I1); </script>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值