amazeui树节点自动展开折叠面板并选中第一个树节点的实现


Posted in HTML / CSS onAugust 24, 2020

适用amazeui.tree版本:未知(截止到2018年10月)

Amaze UI Tree是Amaze框架的扩展,优点是风格与Amaze框架一致,缺点是很不完善,为了能够在项目中应用,对其核心代码做了修改(另文发表,不在此赘述)。其API中选定树节点的函数多次尝试未果,干脆重写一个。如下:

//默认展开折叠面板
                  $("#user-nav").collapse('open');
                   //默认点击第一个button
                   var btnArray = $(".am-tree-branch-name.click-item");
                   btnArray.each(function(i){
                       //console.log($(this).html());
                       if ( i == 1 ) {
                           $(this).click(function(){
                                $(".click-item").removeClass("am-tree-icon");
                                 $(".click-item").removeClass("am-icon-check");
                                 
                                 $(this).addClass("am-tree-icon");
                                 $(this).addClass("am-icon-check");
                                 
                                 var obj = new Object();
                                 obj.title = $(this).attr("data.title");
                                 obj.level = $(this).attr("data.level"); 
                                 $(this).trigger('tree-click', {
                                       data: obj
                                  });
                           });
                           $(this).trigger('click');
                       }
                   });

到此这篇关于amazeui树节点自动展开折叠面板并选中第一个树节点的实现的文章就介绍到这了,更多相关amazeui树节点内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!            

HTML / CSS 相关文章推荐
对CSS3选择器的研究(详解)
Sep 16 HTML / CSS
CSS3+DIV实现漂亮的动画彩色标签
Jun 16 HTML / CSS
一款利用纯css3实现的360度翻转按钮的实例教程
Nov 05 HTML / CSS
利用纯CSS3实现tab选项卡切换示例代码
Sep 21 HTML / CSS
纯CSS3实现扇形动画菜单(简化版)实例源码
Jan 17 HTML / CSS
html5声频audio和视频video等新特性详细说明
Dec 26 HTML / CSS
HTML5本地存储之Database Storage应用介绍
Jan 06 HTML / CSS
html5 worker 实例(二) 图片变换效果
Jun 24 HTML / CSS
浅析border-radius如何兼容IE
Apr 19 HTML / CSS
html5 figure和figcaption的使用方法
Sep 10 HTML / CSS
amazeui 验证按钮扩展的实现
Aug 21 HTML / CSS
css3实现背景图片半透明内容不透明的方法示例
Apr 13 HTML / CSS
如何使用amaze ui的分页样式封装一个通用的JS分页控件
Aug 21 #HTML / CSS
Canvas波浪花环的示例代码
Aug 21 #HTML / CSS
浅谈amaze-ui中datepicker和datetimepicker注意的几点
Aug 21 #HTML / CSS
AmazeUI的JS表单验证框架实战示例分享
Aug 21 #HTML / CSS
amazeui 验证按钮扩展的实现
Aug 21 #HTML / CSS
前端H5 Video常见使用场景简介
Aug 21 #HTML / CSS
前后端结合实现amazeUI分页效果
Aug 21 #HTML / CSS
You might like
日本十大最佳动漫,全都是二次元的神级作品
2019/10/05 日漫
PHP生成带有雪花背景的验证码
2008/09/28 PHP
PHP获取网址的顶级域名函数代码
2012/09/24 PHP
PHP获取php,mysql,apche的版本信息示例代码
2014/01/16 PHP
叫你如何修改Nginx与PHP的文件上传大小限制
2014/09/10 PHP
php中的动态调用实例分析
2015/01/07 PHP
[原创]PHP实现生成vcf vcard文件功能类定义与使用方法详解【附demo源码下载】
2017/09/02 PHP
php转换上传word文件为PDF的方法【基于COM组件】
2019/06/10 PHP
js模拟类继承小例子
2010/07/17 Javascript
js常用排序实现代码
2010/12/28 Javascript
基于jquery的3d效果实现代码
2011/03/23 Javascript
javascript的原生方法获取数组中的最大(最小)值
2012/12/19 Javascript
jquery formValidator插件ajax验证 内容不做任何修改再离开提示错误的bug解决方法
2013/01/04 Javascript
尝试在让script的type属性等于text/html
2013/01/15 Javascript
EXTjs4.0的store的findRecord的BUG演示代码
2013/06/08 Javascript
JS实现的4种数字千位符格式化方法分享
2015/03/02 Javascript
Javascript小技能总结(推荐)
2016/06/02 Javascript
详解Angular之constructor和ngOnInit差异及适用场景
2017/06/22 Javascript
angularjs实现猜大小功能
2017/10/23 Javascript
深入理解nodejs搭建静态服务器(实现命令行)
2019/02/05 NodeJs
微信小程序图片左右摆动效果详解
2019/07/13 Javascript
微信小程序 SOTER 生物认证DEMO 指纹识别功能
2019/12/13 Javascript
解决父组件将子组件作为弹窗调用只执行一次created的问题
2020/07/24 Javascript
python中将字典转换成其json字符串
2014/07/16 Python
python数据处理 根据颜色对图片进行分类的方法
2018/12/08 Python
python使用pandas处理大数据节省内存技巧(推荐)
2019/05/05 Python
解决python flask中config配置管理的问题
2019/07/26 Python
Python底层封装实现方法详解
2020/01/22 Python
简单了解Python字典copy与赋值的区别
2020/09/16 Python
详解html5 shiv.js和respond.min.js
2018/01/24 HTML / CSS
Giglio德国网上精品店:奢侈品服装和配件
2016/09/23 全球购物
会计工作心得体会
2014/01/13 职场文书
五一劳动节慰问信
2015/02/14 职场文书
严以律己专题学习研讨会发言材料
2015/11/09 职场文书
2016年圣诞节义工活动总结
2016/04/01 职场文书
2016年庆祝六一儿童节活动总结
2016/04/06 职场文书