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属性使网站设计增强同时不消弱可用性
Aug 29 HTML / CSS
使用CSS3制作一个简单的Chrome模拟器
Jul 15 HTML / CSS
CSS3中Animation动画属性用法详解
Jul 04 HTML / CSS
CSS3绘制六边形的简单实现
Aug 25 HTML / CSS
使用 css3 实现圆形进度条的示例
Jul 05 HTML / CSS
css3实现多个元素依次显示效果
Dec 12 HTML / CSS
CSS3改变浏览器滚动条样式
Jan 04 HTML / CSS
详解Html5页面实现下载文件(apk、txt等)的三种方式
Oct 22 HTML / CSS
html5默认气泡修改的代码详解
Mar 13 HTML / CSS
HTML5调用手机发短信和打电话功能
Apr 29 HTML / CSS
CSS 一行代码实现头像与国旗的融合
Oct 24 HTML / CSS
css3带你实现3D转换效果
Feb 24 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
第1次亲密接触PHP5(2)
2006/10/09 PHP
PHP下利用shell后台运行PHP脚本,并获取该脚本的Process ID的代码
2011/09/19 PHP
PHP 透明水印生成代码
2012/08/27 PHP
解密ThinkPHP3.1.2版本之独立分组功能应用
2014/06/19 PHP
详解PHP中的null合并运算符
2015/12/30 PHP
PHP自定义递归函数实现数组转JSON功能【支持GBK编码】
2018/07/17 PHP
ext jquery 简单比较
2010/04/07 Javascript
jQuery的链式调用浅析
2010/12/03 Javascript
使用隐藏的new来创建对象
2011/03/29 Javascript
关于JAVASCRIPT urldecode URL解码的问题
2012/01/08 Javascript
jQuery中get()方法用法实例
2014/12/27 Javascript
Bootstrap基本插件学习笔记之模态对话框(16)
2016/12/08 Javascript
Bootstrap源码解读导航(6)
2016/12/23 Javascript
js实现时间轴自动排列效果
2017/03/09 Javascript
bootstrap suggest下拉框使用详解
2017/04/10 Javascript
详解Angular5 服务端渲染实战
2018/01/04 Javascript
JavaScript中var、let、const区别浅析
2018/06/24 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
vue结合element-ui使用示例
2019/01/24 Javascript
js 计数排序的实现示例(升级版)
2020/01/12 Javascript
vue从零实现一个消息通知组件的方法详解
2020/03/16 Javascript
vue实现简易的双向数据绑定
2020/12/29 Vue.js
Eclipse中Python开发环境搭建简单教程
2016/03/23 Python
Python内置模块logging用法实例分析
2018/02/12 Python
Django上使用数据可视化利器Bokeh解析
2019/07/31 Python
Keras搭建自编码器操作
2020/07/03 Python
Bulk Powders意大利:运动补充在线商店
2019/02/09 全球购物
毕业生求职自荐信怎么写
2014/01/08 职场文书
团队会宣传标语
2014/10/09 职场文书
2014个人年度工作总结范文
2014/12/24 职场文书
家庭暴力离婚起诉书
2015/05/18 职场文书
如何设计高效合理的MySQL查询语句
2021/05/26 MySQL
Python实现PIL图像处理库绘制国际象棋棋盘
2021/07/16 Python
C#连接ORACLE出现乱码问题的解决方法
2021/10/05 Oracle
springmvc直接不经过controller访问WEB-INF中的页面问题
2022/02/24 Java/Android
以MySQL5.7为例了解一下执行计划
2022/04/13 MySQL