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实现可编辑表格并用AJAX提交到服务器修改数据
Dec 27 Javascript
appendChild() 或 insertBefore()使用与区别介绍
Oct 11 Javascript
用JS实现3D球状标签云示例代码
Dec 01 Javascript
分享一则JavaScript滚动条插件源码
Mar 03 Javascript
JavaScript实现页面5秒后自动跳转的方法
Apr 16 Javascript
javascript中attachEvent用法实例分析
May 14 Javascript
深入理解javascript的getTime()方法
Feb 16 Javascript
jQuery实现选项卡功能(两种方法)
Mar 08 Javascript
JS检测数组类型的方法小结
Mar 14 Javascript
JS库之Particles.js中文开发手册及参数详解
Sep 13 Javascript
Jquery的Ajax技术使用方法
Jan 21 jQuery
D3.js的基础部分之数组的处理数组的排序和求值(v3版本)
May 09 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/08/29 PHP
php增删改查示例自己写的demo
2013/09/04 PHP
Android AsyncTack 异步任务实例详解
2016/11/02 PHP
javascript HTMLEncode HTMLDecode的完整实例(兼容ie和火狐)
2009/06/02 Javascript
Javascript实现仿WebQQ界面的“浮云”兼容 IE7以上版本及FF
2011/04/27 Javascript
动态获取复选框checkbox选中个数的jquery代码
2013/06/25 Javascript
jquery弹出关闭遮罩层实例
2013/08/06 Javascript
jq实现酷炫的鼠标经过图片翻滚效果
2014/03/12 Javascript
js 中将多个逗号替换为一个逗号的代码
2014/06/07 Javascript
js动态获取子复选项并设计全选及提交的实现方法
2016/06/24 Javascript
JS实现全屏的四种写法
2016/12/30 Javascript
nodejs之get/post请求的几种方式小结
2017/07/26 NodeJs
axios取消请求的实践记录分享
2018/09/26 Javascript
详解JavaScript中的函数、对象
2019/04/01 Javascript
[07:57]2018DOTA2国际邀请赛寻真——PSG.LGD凤凰浴火
2018/08/12 DOTA
从零开始学Python第八周:详解网络编程基础(socket)
2016/12/14 Python
python实现协同过滤推荐算法完整代码示例
2017/12/15 Python
Python语言描述连续子数组的最大和
2018/01/04 Python
python中找出numpy array数组的最值及其索引方法
2018/04/17 Python
python中正则表达式与模式匹配
2019/05/07 Python
python 实现交换两个列表元素的位置示例
2019/06/26 Python
python判断两个序列的成员是否一样的实例代码
2020/03/01 Python
关于python的缩进规则的知识点详解
2020/06/22 Python
python利用os模块编写文件复制功能——copy()函数用法
2020/07/13 Python
Python远程方法调用实现过程解析
2020/07/28 Python
python读取xml文件方法解析
2020/08/04 Python
印尼旅游网站:via
2017/11/12 全球购物
美国电子元器件分销商:Newark element14
2018/01/13 全球购物
新西兰网上购物,折扣店:BestDeals.co.nz
2019/03/20 全球购物
编程实现去掉XML的重复结点
2014/05/28 面试题
2014年机关作风建设工作总结
2014/10/23 职场文书
公司经营目标责任书
2015/01/29 职场文书
Python爬取某拍短视频
2021/06/11 Python
浅谈Python魔法方法
2021/06/28 Java/Android
Java 超详细讲解IO操作字节流与字符流
2022/03/25 Java/Android
Python代码实现双链表
2022/05/25 Python