jsp五级联动菜单mysql_JS实现的五级联动菜单效果完整实例

本文提供了一个使用JavaScript实现的五级联动菜单的完整实例。菜单数据静态定义,适用于不从数据库动态加载选项的情况。示例包括多级菜单的显示和切换,以及详细的代码展示。
摘要由CSDN通过智能技术生成

本文实例讲述了JS实现的五级联动菜单效果。分享给大家供大家参考,具体如下:

js实现多级联动的方法很多,这里给出一种5级联动的例子,其实可以扩展成N级联动,在做项目的时候碰到了这样一个问题但是有不能从数据库中动态的加载这些选项,所以只有想办法从单个的页面着手来处理了,应为项目的表单是动态产生的,所以需要每个流程的设计过程中需要有单独的页面来处理,这样就决定了不能改变已有的业务逻辑来实现多级表单的联动。

运行效果图如下:

7bae3e260ba669e5dbb7cfafa0ca5b1c.png

完整代码如下:

级联

body,select

{

font-size:9pt;

font-family:Verdana;

}

a

{

color:red;

text-decoration:none;

}

a:hover

{

text-decoration:underline;

}

function Dsy()

{

this.Items = {};

}

Dsy.prototype.add = function(id,iArray)

{

this.Items[id] = iArray;

}

Dsy.prototype.Exists = function(id)

{

if(typeof(this.Items[id]) == "undefined")

return false;

return true;

}

function change(v)

{

var str="0";

for(i=0;i

{

str+=("_"+(document.getElementById(s[i]).selectedIndex-1));

};

var ss=document.getElementById(s[v]);

with(ss)

{

length = 0;

options[0]=new Option(opt0[v],opt0[v]);

if(v && document.getElementById(s[v-1]).selectedIndex>0 || !v)

{

if(dsy.Exists(str))

{

ar = dsy.Items[str];

for(i=0;i

if(v)options[1].selected = true;

}

}

if(++v

{

change(v);

}

}

}

var dsy = new Dsy();

dsy.add("0",["投诉申告","业务咨询","用户预约","服务调度","其它"]);

dsy.add("0_0",["标准化产品","行业产品&

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值