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 优势以及网页设计师如何使用CSS3技术
Jul 29 HTML / CSS
各大浏览器 CSS3 和 HTML5 兼容速查表 图文
Apr 01 HTML / CSS
关于CSS Tooltips(鼠标经过时显示)的效果
Apr 10 HTML / CSS
css3中transition属性详解
Sep 02 HTML / CSS
基础的CSS3弹性盒Flexbox布局使用实例
Apr 08 HTML / CSS
html5 乒乓球(碰撞检测)实例二
Jul 25 HTML / CSS
浅谈利用缓存来优化HTML5 Canvas程序的性能
May 12 HTML / CSS
Html5元素及基本语法详解
Aug 02 HTML / CSS
canvas 实现 github404动态效果的示例代码
Nov 15 HTML / CSS
一文彻底解决HTML5页面中长按保存图片功能
Jun 10 HTML / CSS
html5 横向滑动导航栏的方法示例
May 08 HTML / CSS
CSS实现章节添加自增序号的方法
Jun 23 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
为查询结果建立向后/向前按钮
2006/10/09 PHP
PHP+MYSQL开发工具及资源收藏
2007/01/02 PHP
PHP 获取远程网页内容的代码(fopen,curl已测)
2011/06/06 PHP
PHP递归创建多级目录
2015/11/05 PHP
Laravel6.2中用于用户登录的新密码确认流程详解
2019/10/16 PHP
Highslide.js是一款基于js实现的网页中图片展示插件
2020/03/30 Javascript
javascript学习基础笔记之DOM对象操作
2011/11/03 Javascript
js Dialog 实践分享
2012/10/22 Javascript
JS通过分析userAgent属性来判断浏览器的类型及版本
2014/03/28 Javascript
设置jQueryUI DatePicker默认语言为中文
2016/06/04 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
2016/08/18 Javascript
认识less和webstrom的less配置方法
2017/08/02 Javascript
bootstrap3中container与container_fluid外层容器的区别讲解
2017/12/04 Javascript
vue中阻止click事件冒泡,防止触发另一个事件的方法
2018/02/08 Javascript
clipboard.js在移动端复制失败的解决方法
2018/06/13 Javascript
新手简单了解vue
2019/05/29 Javascript
Python pass 语句使用示例
2014/03/11 Python
Python编程中的文件操作攻略
2015/10/16 Python
用生成器来改写直接返回列表的函数方法
2017/05/25 Python
python实战之实现excel读取、统计、写入的示例讲解
2018/05/02 Python
Python实现的列表排序、反转操作示例
2019/03/13 Python
Python机器学习算法库scikit-learn学习之决策树实现方法详解
2019/07/04 Python
Django框架模型简单介绍与使用分析
2019/07/18 Python
Python字典生成式、集合生成式、生成器用法实例分析
2020/01/07 Python
Python绘图之二维图与三维图详解
2020/08/04 Python
关于HTML5语义标签的实践(blog页面)
2016/07/12 HTML / CSS
瑜伽服装品牌:露露柠檬(lululemon athletica)
2017/06/04 全球购物
美国首屈一指的礼品篮供应商:GiftTree
2018/01/06 全球购物
智能钱包:Ekster
2019/11/21 全球购物
魅力教师事迹材料
2014/01/10 职场文书
工商行政管理专业求职书
2014/05/23 职场文书
党员教师个人对照检查材料(群众路线)
2014/09/26 职场文书
网球场地租赁协议范本
2014/10/07 职场文书
心灵捕手观后感
2015/06/02 职场文书
狼牙山五壮士观后感
2015/06/09 职场文书
CSS 制作波浪效果的思路
2021/05/18 HTML / CSS