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 相关文章推荐
用dom+xhtml+css制作的一个相册效果代码打包下载
Jan 24 Javascript
在javascript中使用com组件的简单实现方法
Aug 17 Javascript
easyui datagrid 大数据加载效率慢,优化解决方法(推荐)
Nov 09 Javascript
详解Sea.js中Module.exports和exports的区别
Feb 12 Javascript
react-native之ART绘图方法详解
Aug 08 Javascript
Vant的安装和配合引入Vue.js项目里的方法步骤
Dec 05 Javascript
JavaScript常见事件对象与操作实例总结
Jan 05 Javascript
angularjs实现table表格td单元格单击变输入框/可编辑状态示例
Feb 21 Javascript
详解如何在vue项目中使用layui框架及采坑
May 05 Javascript
微信小程序实现音乐播放器
Nov 20 Javascript
Javascript模块化机制实现原理详解
Apr 02 Javascript
webpack+express实现文件精确缓存的示例代码
Jun 11 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获取目录所有文件并将结果保存到数组(实例)
2013/10/25 PHP
php实现字符串翻转的方法
2015/03/27 PHP
javascript Select标记中options操作方法集合
2008/10/22 Javascript
使用jquery清空、复位整个输入域
2015/04/02 Javascript
JavaScript头像上传插件源码分享
2016/03/29 Javascript
JS iFrame加载慢怎么解决
2016/05/13 Javascript
基于AngularJs + Bootstrap + AngularStrap相结合实现省市区联动代码
2016/05/30 Javascript
Google 地图类型详解及示例代码
2016/08/06 Javascript
jQuery特殊符号转义的实现
2016/11/30 Javascript
JavaScript实现图像模糊化的方法实例
2017/01/15 Javascript
jQuery实现的表格前端排序功能示例
2017/09/18 jQuery
JS实现前端缓存的方法
2017/09/21 Javascript
详解使用React全家桶搭建一个后台管理系统
2017/11/04 Javascript
详解Node使用Puppeteer完成一次复杂的爬虫
2018/04/18 Javascript
JavaScript面向对象程序设计创建对象的方法分析
2018/08/13 Javascript
Net微信网页开发 使用微信JS-SDK获取当前地理位置过程详解
2019/08/26 Javascript
基于html+css+js实现简易计算器代码实例
2020/02/28 Javascript
基于JavaScript实现控制下拉列表
2020/05/08 Javascript
关于angular浏览器兼容性问题的解决方案
2020/07/26 Javascript
JavaScript代码实现简单计算器
2020/12/27 Javascript
python 网络爬虫初级实现代码
2016/02/27 Python
python3实现163邮箱SMTP发送邮件
2018/05/22 Python
Python脚本修改阿里云的访问控制列表的方法
2019/03/08 Python
python中struct模块之字节型数据的处理方法
2019/08/27 Python
Python3 元组tuple入门基础
2020/02/09 Python
Html5之svg可缩放矢量图形_动力节点Java学院整理
2017/07/17 HTML / CSS
详解h5页面在不同ios设备上的问题总结
2019/03/01 HTML / CSS
如何判断计算机可能已经中马
2013/03/22 面试题
高考备战决心书
2014/03/11 职场文书
工程售后服务承诺书
2014/05/21 职场文书
新员工入职欢迎词
2015/01/23 职场文书
教师个人教学总结
2015/02/11 职场文书
珍惜时间的诗歌赏析
2019/08/23 职场文书
Python控制台输出俄罗斯方块的方法实例
2021/04/17 Python
Pandas 数据编码的十种方法
2022/04/20 Python
MySQL sql模式设置引起的问题
2022/05/15 MySQL