实例讲解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 相关文章推荐
xheditor与validate插件冲突的解决方案
Apr 15 Javascript
浅析ajax请求json数据并用js解析(示例分析)
Jul 13 Javascript
JS限制Textarea文本域字符个数的具体实现
Aug 02 Javascript
js验证输入是否为手机号码或电话号码示例
Dec 30 Javascript
Js实现自定义右键行为
Mar 26 Javascript
jQuery实现下拉框选择图片功能实例
Aug 08 Javascript
JavaScript操作XML/HTML比较常用的对象属性集锦
Oct 30 Javascript
JavaScript+html5 canvas实现本地截图教程
Apr 16 Javascript
jQuery 3 中的新增功能汇总介绍
Jun 12 Javascript
关于JSON与JSONP简单总结
Aug 16 Javascript
jQuery删除/清空指定元素的所有子节点实例代码
Jul 04 jQuery
node.js中 redis 的安装和基本操作示例
Feb 10 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
从Web查询数据库之PHP与MySQL篇
2009/09/25 PHP
php使用curl抓取qq空间的访客信息示例
2014/02/28 PHP
PHP封装的一个支持HTML、JS、PHP重定向的多功能跳转函数
2014/06/19 PHP
php合并数组中相同元素的方法
2014/11/13 PHP
如何写php守护进程(Daemon)
2015/12/30 PHP
WordPress开发中用于获取近期文章的PHP函数使用解析
2016/01/05 PHP
PHP中empty,isset,is_null用法和区别
2017/02/19 PHP
PHP的curl函数的用法总结
2019/02/14 PHP
使用jQuery实现的掷色子游戏动画效果
2014/03/14 Javascript
JQuery插件iScroll实现下拉刷新,滚动翻页特效
2014/06/22 Javascript
更快的异步执行(setTimeout多浏览器)
2014/08/12 Javascript
JavaScript的类型、值和变量小结
2015/07/09 Javascript
用JS实现图片轮播效果代码(一)
2016/06/26 Javascript
JS中对Cookie的操作详解
2016/08/05 Javascript
javascript数组去重方法分析
2016/12/15 Javascript
js每隔两秒输出数组中的一项(实例)
2017/05/28 Javascript
Echart折线图手柄触发事件示例详解
2018/12/16 Javascript
Vue如何使用混合Mixins和插件开发详解
2020/02/05 Javascript
如何手写简易的 Vue Router
2020/10/10 Javascript
JavaScript TAB栏切换效果的示例
2020/11/05 Javascript
Python实现将绝对URL替换成相对URL的方法
2015/06/28 Python
python 数据提取及拆分的实现代码
2019/08/26 Python
Python 文件操作之读取文件(read),文件指针与写入文件(write),文件打开方式示例
2019/09/29 Python
Python下载网易云歌单歌曲的示例代码
2020/08/12 Python
荷兰浴室和卫浴网上商店:Badkamerxxl.nl
2020/10/06 全球购物
Linux内核产生并发的原因
2012/07/13 面试题
幼儿园教师国培感言
2014/02/02 职场文书
连锁酒店店长职责范本
2014/02/13 职场文书
今冬明春火灾防控工作方案
2014/05/29 职场文书
七夕相亲活动策划方案
2014/08/31 职场文书
永远跟党走演讲稿
2014/09/12 职场文书
高考作弊检讨书1500字
2015/02/16 职场文书
身份证丢失证明
2015/06/19 职场文书
《月光曲》教学反思
2016/02/16 职场文书
2019财务毕业实习报告
2019/06/27 职场文书
Python 数据结构之十大经典排序算法一文通关
2021/10/16 Python