JS 无限级 Select效果实现代码(json格式)


Posted in Javascript onAugust 30, 2011

演示地址: http://demo.3water.com/js/2011/js_select/index.htm
数据

var data=[ 
{id:1,name:"前端开发",pid:0}, 
{id:2,name:"CSS",pid:1}, 
{id:3,name:"JS",pid:1}, 
{id:4,name:"HTML",pid:1}, 
{id:5,name:"数据库",pid:0}, 
{id:6,name:"SQLServer",pid:5}, 
{id:7,name:"MYSql",pid:5}, 
{id:8,name:"Oracle",pid:5}, 
{id:9,name:"PLSQL",pid:8} 
];

无限级 select demo1
var demo1=Doc.Get("demo1"); 
var chg=function(obj){ 
if(obj.options.length>1){ 
obj.selectedIndex=0; 
demo1.appendChild(obj); 
} 
} 
var sel1=new Select(data,chg); 
var _arr=sel1.getDom(); 
for(var i=0;i<_arr.length;i++){ 
demo1.appendChild(_arr[i]); 
}

无限级 select demo2
var demo2=Doc.Get("demo2"); 
var chg=function(obj){ 
if(obj.options.length>1){ 
obj.selectedIndex=0; 
demo2.appendChild(obj); 
} 
} 
var sel=new Select(data,chg); 
var _arr=sel.getDom(9); 
for(var i=0;i<_arr.length;i++){ 
demo2.appendChild(_arr[i]); 
}
Javascript 相关文章推荐
jquery 层次选择器siblings与nextAll的区别介绍
Aug 02 Javascript
JQuery结合CSS操作打印样式的方法
Dec 24 Javascript
jQuery实现仿QQ在线客服效果的滚动层代码
Oct 15 Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 Javascript
jQuery实现的简单百分比进度条效果示例
Aug 01 Javascript
微信小程序中使用javascript 回调函数
May 11 Javascript
解决React Native端口号修改的方法
Jul 28 Javascript
JavaScript递归算法生成树形菜单
Aug 15 Javascript
vue-router中scrollBehavior的巧妙用法
Jul 09 Javascript
详解KOA2如何手写中间件(装饰器模式)
Oct 11 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
Oct 23 Javascript
记录vue项目中遇到的一点小问题
May 14 Javascript
javascript 原型继承介绍
Aug 30 #Javascript
dojo学习第二天 ajax异步请求之绑定列表
Aug 29 #Javascript
非常强大的 jQuery.AsyncBox 弹出对话框插件
Aug 29 #Javascript
新浪微博字数统计 textarea字数统计实现代码
Aug 28 #Javascript
Javascript面向对象编程(三) 非构造函数的继承
Aug 28 #Javascript
Javascript面向对象编程(二) 构造函数的继承
Aug 28 #Javascript
Javascript 面向对象编程(一) 封装
Aug 28 #Javascript
You might like
php中批量删除Mysql中相同前缀的数据表的代码
2011/07/01 PHP
30 个很棒的PHP开源CMS内容管理系统小结
2011/10/14 PHP
php 获取本地IP代码
2013/06/23 PHP
PHP的Yii框架入门使用教程
2016/02/15 PHP
PHP面向对象程序设计高级特性详解(接口,继承,抽象类,析构,克隆等)
2016/12/02 PHP
PHP基于关联数组20行代码搞定约瑟夫问题示例
2017/11/07 PHP
Ubuntu彻底删除PHP7.0的方法
2018/07/27 PHP
用JavaScript实现一个代码简洁、逻辑不复杂的多级树
2014/05/23 Javascript
Node.js中使用事件发射器模式实现事件绑定详解
2014/08/15 Javascript
jquery+javascript编写国籍控件
2015/02/12 Javascript
JavaScript操作Cookie详解
2015/02/28 Javascript
nodejs调用cmd命令实现复制目录
2015/05/04 NodeJs
WordPress中鼠标悬停显示和隐藏评论及引用按钮的实现
2016/01/12 Javascript
详解AngularJS 模态对话框
2016/04/07 Javascript
微信小程序 后台https域名绑定和免费的https证书申请详解
2016/11/10 Javascript
详解nodeJS之路径PATH模块
2017/05/31 NodeJs
jQuery实现QQ空间汉字转拼音功能示例
2017/07/10 jQuery
微信小程序之GET请求的实例详解
2017/09/29 Javascript
webpack4.x开发环境配置详解
2018/08/04 Javascript
node中实现删除目录的几种方法
2019/06/24 Javascript
Vue源码分析之Vue实例初始化详解
2019/08/25 Javascript
viewer.js一个强大的基于jQuery的图像查看插件(支持旋转、缩放)
2020/04/01 jQuery
用Python脚本生成Android SALT扰码的方法
2013/09/18 Python
Python判断某个用户对某个文件的权限
2016/10/13 Python
Python中int()函数的用法浅析
2017/10/17 Python
Python从使用线程到使用async/await的深入讲解
2018/09/16 Python
python+splinter自动刷新抢票功能
2018/09/25 Python
python 实现图片旋转 上下左右 180度旋转的示例
2019/01/24 Python
python pip源配置,pip配置文件存放位置的方法
2019/07/12 Python
Django实现发送邮件找回密码功能
2019/08/12 Python
python GUI库图形界面开发之PyQt5动态(可拖动控件大小)布局控件QSplitter详细使用方法与实例
2020/03/06 Python
苏格兰在线威士忌商店:The Whisky Barrel
2019/05/07 全球购物
魅力教师事迹材料
2014/01/10 职场文书
大学生第一学年自我鉴定2015
2014/09/28 职场文书
祝福语集锦:送给毕业同学祝福语
2019/11/21 职场文书
SQL CASE 表达式的具体使用
2022/03/21 SQL Server