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 选择器 属性选择器介绍
Jan 21 HTML / CSS
css3实现六边形边框的实例代码
May 24 HTML / CSS
HTML5如何实现元素拖拽
Mar 11 HTML / CSS
HTML5实现分享到微信好友朋友圈QQ好友QQ空间微博二维码功能
Jan 03 HTML / CSS
HTML5: Web 标准最巨大的飞跃
Oct 17 HTML / CSS
html5在移动端的屏幕适应问题示例探讨
Jun 15 HTML / CSS
IE9对HTML5中部分属性不支持的原因分析
Oct 15 HTML / CSS
详解HTML5 Canvas绘制时指定颜色与透明度的方法
Mar 25 HTML / CSS
HTML5 直播疯狂点赞动画实现代码 附源码
Apr 14 HTML / CSS
HTML通过表单实现酒店筛选功能
May 18 HTML / CSS
浅析CSS在DevTools 中架构演变
Oct 05 HTML / CSS
HTML5 新增内容和 API详解
Nov 17 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
php木马攻击防御之道
2008/03/24 PHP
php循环创建目录示例分享(php创建多级目录)
2014/03/04 PHP
php 截取utf-8格式的字符串实例代码
2016/10/30 PHP
php实现页面纯静态的实例代码
2017/06/21 PHP
laravel5.1 ajax post 传值_token示例
2019/10/24 PHP
实例讲解PHP表单
2020/06/10 PHP
避免 showModalDialog 弹出新窗体的原因分析
2010/05/31 Javascript
ymPrompt的doHandler方法来实现获取子窗口返回值的方法
2010/06/25 Javascript
JS调用CS里的带参方法实例
2013/08/01 Javascript
jquery链式操作的正确使用方法
2014/01/06 Javascript
js登录弹出层特效
2014/03/07 Javascript
$.each遍历对象、数组的属性值并进行处理
2014/07/18 Javascript
jQuery中:hidden选择器用法实例
2014/12/30 Javascript
JavaScript中调用函数的4种方式代码实例
2015/07/08 Javascript
jquery.mousewheel实现整屏翻屏效果
2015/08/30 Javascript
JS弹出窗口插件zDialog简单用法示例
2016/06/12 Javascript
利用jQuery实现打字机字幕效果实例代码
2016/09/02 Javascript
Javascript之面向对象--封装
2016/12/02 Javascript
详谈js中window.location.search的用法和作用
2017/02/13 Javascript
javascript 数据存储的常用函数总结
2017/06/01 Javascript
微信小程序表单验证功能完整实例
2017/12/01 Javascript
vue自动化表单实例分析
2018/05/06 Javascript
详解vue中localStorage的使用方法
2018/11/22 Javascript
浅谈JavaScript_DOM学习篇_图片切换小案例
2019/03/19 Javascript
pandas重新生成索引的方法
2018/11/06 Python
Python利用matplotlib绘制约数个数统计图示例
2019/11/26 Python
python使用 cx_Oracle 模块进行查询操作示例
2019/11/28 Python
python GUI库图形界面开发之PyQt5多行文本框控件QTextEdit详细使用方法实例
2020/02/28 Python
使用python无账号无限制获取企查查信息的实例代码
2020/04/17 Python
HTML5实现Notification API桌面通知功能
2016/03/02 HTML / CSS
SQL Server里面什么样的视图才能创建索引
2015/04/17 面试题
2014镇党委班子对照检查材料思想汇报
2014/09/23 职场文书
四风问题对照检查材料整改措施
2014/09/27 职场文书
新郎结婚保证书
2015/02/26 职场文书
教务处干事工作总结
2015/08/14 职场文书
Nginx设置日志打印post请求参数的方法
2021/03/31 Servers