实例讲解jQuery EasyUI tree中state属性慎用


Posted in Javascript onApril 01, 2016

EasyUI 1.4.4 tree控件中,如果是叶子节点,切忌把state设置为closed,否则该节点会加载整个tree,形成死循环

例如:

json入下:

[
{
"checked": false,
"iconCls": "",
"id": "dec",
"pid": "",
"state": "closed",
"text": "test",
"type": "ORG"
}
]

实例讲解jQuery EasyUI tree中state属性慎用

状态改为open或者为空,显示正常

实例讲解jQuery EasyUI tree中state属性慎用

下面给大家介绍easyui tree自定义属性的使用

了解easyui tree组件的童鞋估计都知道tree的node有他自己单独的属性(id,text,iconCls,checked,state,attribute,target)。而原先这个几个属性想要通过html的方式赋值实例的话,是不能完全做到的。attribute属性必须json的方式才能赋值。这也给我们开发带来了一下不便。而如今有了data-options这个属性,一切问题都迎刃而解了。

定义一棵nide带有特殊属性的node就可以通过如下方式实现了

<ul id="tt" class="easyui-tree" data-options="animate:true,dnd:true">
<li>
<span>Folder</span>
<ul>
<li data-options="state:'closed'">
<span>Sub Folder </span>
<ul>
<li data-options="attributes:{'url':'xxxxx'}">
<span><a href="#">File </a></span>
</li>
<li data-options="attributes:{'url':'xxxxx'}">
<span>File </span>
</li>
<li>
<span>File </span>
</li>
</ul>
</li>
<li data-options="attributes:{'url':'xxxxx'}">
<span>File </span>
</li>
<li data-options="attributes:{'url':'xxxxx'}">
<span>File </span>
</li>
<li id="" data-options="attributes:{'url':'xxxxx'}">File </li>
<li>File </li>
</ul>
</li>
<li>
<span>File</span>
</li>
</ul>

然后我们通过js方法获取到tree的node对象的时候 就可以直接node.attributes.url获取到相应的值了。

Javascript 相关文章推荐
js里怎么取select标签里的值并修改
Dec 10 Javascript
jQuery自动切换/点击切换选项卡效果的小例子
Aug 12 Javascript
原生js获取宽高与jquery获取宽高的方法关系对比
Apr 04 Javascript
《JavaScript DOM 编程艺术》读书笔记之JavaScript 简史
Jan 09 Javascript
Bootstrap每天必学之进度条
Nov 30 Javascript
JavaScript代码实现左右上下自动晃动自动移动
Apr 08 Javascript
Bootstrap CSS布局之列表
Dec 15 Javascript
详解如何在Vue里建立长按指令
Aug 20 Javascript
JS实现鼠标拖拽盒子移动及右键点击盒子消失效果示例
Jan 29 Javascript
详解vuex数据传输的两种方式及this.$store undefined的解决办法
Aug 26 Javascript
jQuery实现每日秒杀商品倒计时功能
Sep 06 jQuery
详解小程序如何改变onLoad的执行时机
Nov 01 Javascript
EasyUi combotree 实现动态加载树节点
Apr 01 #Javascript
如何在Linux上安装Node.js
Apr 01 #Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
Apr 01 #Javascript
简介EasyUI datagrid editor combogrid搜索框的实现
Apr 01 #Javascript
jQuery实现的导航动画效果(附demo源码)
Apr 01 #Javascript
JS中frameset框架弹出层实例代码
Apr 01 #Javascript
JS操作COOKIE实现备忘记录的方法
Apr 01 #Javascript
You might like
phpmyadmin 常用选项设置详解版
2010/03/07 PHP
PHP实现RTX发送消息提醒的实例代码
2017/01/03 PHP
php实现基于pdo的事务处理方法示例
2017/07/21 PHP
PHP序列化的四种实现方法与横向对比
2018/11/29 PHP
Laravel find in set排序实例
2019/10/09 PHP
PHP数组访问常用方法解析
2020/09/05 PHP
PHPstorm激活码2020年5月13日亲测有效
2020/09/17 PHP
B/S开发中常用javaScript技术与代码
2007/03/09 Javascript
初学JavaScript第二章
2008/09/30 Javascript
解析Jquery的LigerUI如何实现文件上传
2013/07/09 Javascript
JS 获取鼠标左右键的键值方法
2014/10/11 Javascript
JavaScript获取URL汇总
2015/06/08 Javascript
解决jQuery使用JSONP时产生的错误
2015/12/02 Javascript
jQuery中trigger()与bind()用法分析
2015/12/18 Javascript
JavaScript程序开发之JS代码放置的位置
2016/01/15 Javascript
JQuery validate插件Remote用法大全
2016/05/15 Javascript
详解闭包解决jQuery中AJAX的外部变量问题
2017/02/22 Javascript
vue 实现剪裁图片并上传服务器功能
2018/03/01 Javascript
记一次vue去除#问题处理经过小结
2019/01/24 Javascript
JS中自定义事件的使用与触发操作实例分析
2019/11/01 Javascript
Vue页面跳转传递参数及接收方式
2020/09/09 Javascript
python MultipartEncoder传输zip文件实例
2020/04/07 Python
Win10下用Anaconda安装TensorFlow(图文教程)
2020/06/18 Python
浅谈Python 参数与变量
2020/06/20 Python
一文弄懂Pytorch的DataLoader, DataSet, Sampler之间的关系
2020/07/03 Python
美国马匹用品和马钉购物网站:State Line Tack
2018/08/05 全球购物
英国在线药房:Express Chemist
2019/03/28 全球购物
巴西独家产品和现场演示购物网站:Shoptime
2019/07/11 全球购物
会计自我鉴定范文
2013/10/06 职场文书
公司拓展活动方案
2014/02/13 职场文书
弄虚作假心得体会
2014/09/10 职场文书
离职感谢信
2015/01/21 职场文书
学术会议通知
2015/04/15 职场文书
电影红河谷观后感
2015/06/11 职场文书
2016年教师学习廉政准则心得体会
2016/01/20 职场文书
Win11如何设置右键单击显示所有选项?Win11右键单击显示所有选项设置教程
2022/04/08 数码科技