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 相关文章推荐
dwr spring的集成实现代码
Mar 22 Javascript
JS 文件本身编码转换 图文教程
Oct 12 Javascript
JavaScript 轻松搞定快捷留言功能 只需一行代码
Apr 01 Javascript
一个收集图片的bookmarlet(js 刷新页面中的图片)
May 27 Javascript
JQuery文字列表向上滚动的代码
Nov 13 Javascript
jQuery实现鼠标经过图片变亮其他变暗效果
May 08 Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 Javascript
zTree插件下拉树使用入门教程
Apr 11 Javascript
用JS动态改变表单form里的action值属性的两种方法
May 25 Javascript
小试SVG之新手小白入门教程
Jan 08 Javascript
vue实现codemirror代码编辑器中的SQL代码格式化功能
Aug 27 Javascript
JS实现简单tab选项卡切换
Oct 25 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+javascript模拟Matrix画面
2006/10/09 PHP
PHP中把错误日志保存在系统日志中(Windows系统)
2015/06/23 PHP
PHP PDO操作MySQL基础教程
2017/06/05 PHP
win10 apache配置虚拟主机后localhost无法使用的解决方法
2018/01/27 PHP
纯CSS打造的导航菜单(附jquery版)
2010/08/07 Javascript
JS通过相同的name进行表格求和代码
2013/08/18 Javascript
Javascript中3种实现继承的方法和代码实例
2014/08/12 Javascript
node.js中debug模块的简单介绍与使用
2017/04/25 Javascript
Centos6.8下Node.js安装教程
2017/05/12 Javascript
jQuery实现左右滑动的toggle方法
2018/03/03 jQuery
VUE 3D轮播图封装实现方法
2018/07/03 Javascript
JS双向链表实现与使用方法示例(增加一个previous属性实现)
2019/01/31 Javascript
详解vue引入子组件方法
2019/02/12 Javascript
详解js动态获取浏览器或页面等容器的宽高
2019/03/13 Javascript
js编写简易的计算器
2020/07/29 Javascript
原生JavaScript实现弹幕组件的示例代码
2020/10/12 Javascript
微信小程序实现可长按移动控件
2020/11/01 Javascript
js实现简单图片拖拽效果
2021/02/22 Javascript
用实例分析Python中method的参数传递过程
2015/04/02 Python
python通过openpyxl生成Excel文件的方法
2015/05/12 Python
Python探索之爬取电商售卖信息代码示例
2017/10/27 Python
django框架之cookie/session的使用示例(小结)
2018/10/15 Python
Python文件操作函数用法实例详解
2019/12/24 Python
Centos7下源码安装Python3 及shell 脚本自动安装Python3的教程
2020/03/07 Python
什么是继承
2013/12/07 面试题
军训的自我鉴定
2013/12/10 职场文书
销售冠军获奖感言
2014/02/03 职场文书
化妆品促销方案
2014/02/24 职场文书
《东方明珠》教学反思
2014/04/20 职场文书
经济管理自荐书
2014/06/09 职场文书
民事撤诉申请书范本
2015/05/18 职场文书
MySQL 查询速度慢的原因
2021/05/25 MySQL
《我的美好婚事》动画化决定纪念插画与先导PV公开
2022/04/06 日漫
原生JS实现分页
2022/04/19 Javascript
Python 中面向接口编程
2022/05/20 Python
MyBatis核心源码深度剖析SQL语句执行过程
2022/05/20 Java/Android