JS如何实现五级联动菜单效果

这篇文章主要为大家展示了“JS如何实现五级联动菜单效果”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JS如何实现五级联动菜单效果”这篇文章吧。

创新互联专注为客户提供全方位的互联网综合服务,包含不限于成都网站设计、网站制作、曾都网络推广、微信小程序、曾都网络营销、曾都企业策划、曾都品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;创新互联为所有大学生创业者提供曾都建站搭建服务,24小时服务热线:18982081108,官方网址:www.cdcxhl.com

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

运行效果图如下:

JS如何实现五级联动菜单效果

完整代码如下:



级联



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;i0 || !v)
    {
      if(dsy.Exists(str))
      {
        ar = dsy.Items[str];
        for(i=0;i

var s=["s1","s2","s3","s4","s5"];
var opt0 = ["一级选择","二级选择","三级选择","四级选择","五级选择"];
function setup()
{
  for(i=0;i










以上是“JS如何实现五级联动菜单效果”这篇文章的所有内容,感谢各位的阅读!相信大家都有了一定的了解,希望分享的内容对大家有所帮助,如果还想学习更多知识,欢迎关注创新互联行业资讯频道!


网站栏目:JS如何实现五级联动菜单效果
文章路径:http://ybzwz.com/article/ihghjo.html