javascript实现树形菜单的方法
作者:洞悉 发布时间:2024-11-17 21:09:02
标签:javascript,树形,菜单
本文实例讲述了javascript实现树形菜单的方法。分享给大家供大家参考。具体如下:
var ME={
ini:{i:true,d:{},d1:{},h:0,h1:0,h2:0},
html:function(da,f){
var s='<ul'+(f?' class="f"':'')+'>';
for(var i=0,l=da.length;i<l;i++){
if(typeof(da[i].pid)=='object'){
s+='<li><button type="button" class="'+(i==0&&this.ini.i?'s1':(i+1==l?'s5':'s3'))+'" onclick="ME.yc(this)"></button><span><button type="button" class="r1"></button><a href="javascript:;">'+da[i].ming+'</a></span>';
this.ini.i=false;
s+=this.html(da[i].pid,(i+1==l));
}else{
s+='<li><button type="button" class="'+(i+1==l?'e3':'e1')+'"></button><span><button type="button" class="m1"></button><a href="https://www.aspxhome.com" target="mainFrame">'+da[i].ming+'</a></span>';
}
s+='</li>';
}
s+='</ul>';
return s;
},
st:function(id,da){
document.getElementById(id).innerHTML=this.html(da);
},
yc:function(a){
var s=a.className.substr(1);
if(s%2){
this.ini.d=a.parentNode.children[2];
this.ini.h1=this.hei(this.ini.d);
this.ini.h3=this.ini.h1/10;
this.yc1(1);
a.className='s'+(parseInt(s)+1);
a.parentNode.children[1].children[0].className='r2';
var ol=a.parentNode.parentNode._;
if(typeof(ol)=='object'){
this.ini.d1=ol;
this.ini.h=ol.offsetHeight;
this.ini.h2=this.ini.h/10;
this.yc2(1);
ol.parentNode.children[0].className='s'+(parseInt(ol.parentNode.children[0].className.substr(1))-1);
ol.parentNode.children[1].children[0].className='r1';
}
a.parentNode.parentNode._=a.parentNode.children[2];
}else{
this.ini.d1=a.parentNode.children[2];
this.ini.h=this.ini.d1.offsetHeight;
this.ini.h2=this.ini.h/10;
this.yc2(1);
a.className='s'+(parseInt(s)-1);
a.parentNode.children[1].children[0].className='r1';
a.parentNode.parentNode._='';
}
},
yc1:function(b){
var h1=ME.ini.h1-(11/(b+1)-1)*ME.ini.h3;
with(ME.ini.d.style){
height=h1+'px';
display='block';
}
if(b<10){
setTimeout('ME.yc1('+(b+1)+')',25);
}else{
ME.ini.d.style.display='block';
ME.ini.d.style.height='';
}
},
yc2:function(b){
var h1=(11/(b+1)-1)*ME.ini.h2;
with(ME.ini.d1.style){
height=h1+'px';
}
if(b<10){
setTimeout('ME.yc2('+(b+1)+')',25);
}else{
ME.ini.d1.style.display='';
ME.ini.d1.style.height='';
}
},
hei:function(a){
var b=a.cloneNode(true);
b.style.position='absolute';
b.style.display='block';
b.style.visibility='hidden';
a.parentNode.appendChild(b);
var h=b.offsetHeight;
a.parentNode.removeChild(b);
return h;
}
}
希望本文所述对大家的javascript程序设计有所帮助。


猜你喜欢
- 本文实例为大家分享了python交互式图形编程的具体代码,供大家参考,具体内容如下#!/usr/bin/env python3# -*- c
- 一、爬虫的简单理解1. 什么是爬虫?网络爬虫也叫网络蜘蛛,如果把互联网比喻成一个蜘蛛网,那么蜘蛛就是在网上爬来爬去的蜘蛛,爬虫程序通过请求u
- 本文实例讲述了Python实现绘制双柱状图并显示数值功能。分享给大家供大家参考,具体如下:# -*- coding:utf-8 -*-#!
- 万维网联盟(W3C)发布了HTML 5规格说明书的草稿 ,这是自HTML 4在十多年前发布以来的第一个主要的修订版.在这期间,随着开发者逐渐
- 下拉框包含option中的Value和用来显示的选项, 一般后台都是使用的Value值,而不是显示在前台的选项第一步: 编写下拉框需要的枚举
- 本文实例讲述了Python实现将HTML转换成doc格式文件的方法。分享给大家供大家参考,具体如下:网页上的一些文章,因为有格式的原因,它们
- 获取一组radio被选中项的值var item = $(’input[@name=items][@checke
- 日志日志是跟踪软件运行时所发生的事件的一种方法。软件开发者在代码中调用日志函数,表明发生了特定的事件。事件由描述性消息描述,该描述性消息可以
- 今天是边复习边创作博客的第三天,我今年大二,我们专业开的有这门课程,因为喜欢所以更加认真学习,本以为没人看呢,看了后台浏览量让我更加认真创作
- 今天给大家介绍一个非常 NB 的Python 库,专门用来绘制地图的,它叫 Folium 。1. Folium简介Folium是一个基于le
- 第一步my-default.ini 添加配置:#绑定IPv4和3306端bind-address = 127.0.0.1port = 330
- python寻找主串中所有指定子串下标该函数可实现显示字符串中指定子串所有下标(首字下标)def subStrIndex(substr,st
- python之标准库htmlhtml库是用于解析HTML的一个工具,是python自带的标准库之一。html库位置:__init__.py文
- 一、数据类型在tf中,数据类型有整型(默认是int32),浮点型(默认是float32),以及布尔型,字符串。二、数据类型信息①.devic
- 近日在Ubuntu上安装了一个 MySQL 5.0,因为使用 phpMyAdmin 还必须安装 PHP,所以打算直接使用远程管理工具Navi
- 前言模块在其自身的作用域里执行,而不是在全局作用域里;这意味着定义在一个模块里的变量,函数,类等等在模块外部是不可见的,除非你明确地使用ex
- 问题最近,在用SSH框架完成一个实践项目时,碰到了一个莫名其妙的Bug困扰了我好久,最后终于解决,记录如下。问题:同学在测试系统的时候突然发
- 首先进入python官网https://www.python.org/通过Downloads选项,选择需要的版本进行下载,此处我以 Wind
- 总结了一下自己工作中使用到的注释书写规范,没有什么技术含量,只是用于统一制作方式,方便维护。包含了“区域注释”、“单行注释”、“注释层级”和
- 一、准备工作:安装pywin32,后面开发需要pywin32的支持,否则无法完成与windows层面相关的操作。pywin32的具体安装及注