实例讲解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 相关文章推荐
一个tab标签切换效果代码
Mar 27 Javascript
JQuery 将元素显示在屏幕的中央的代码
Feb 27 Javascript
Jquery轮播效果实现过程解析
Mar 30 Javascript
jQuery AJAX timeout 超时问题详解
Jun 21 Javascript
javascript 中的console.log和弹出窗口alert
Aug 30 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
Sep 23 Javascript
Three.js如何用轨迹球插件(trackball)增加对模型的交互功能详解
Sep 25 Javascript
vue devtools的安装与使用教程
Aug 08 Javascript
tweenjs缓动算法的使用实例分析
Aug 26 Javascript
Vue-router 报错NavigationDuplicated的解决方法
Mar 31 Javascript
Vue自定义表单内容检查rules实例
Oct 30 Javascript
在vue项目中封装echarts的步骤
Dec 25 Vue.js
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
我的论坛源代码(九)
2006/10/09 PHP
php 中文字符串首字母的获取函数分享
2013/11/04 PHP
php获取网页中图片、DIV内容的简单方法
2014/06/19 PHP
ThinkPHP实现将SESSION存入MYSQL的方法
2014/07/22 PHP
PHP实现的统计数据功能详解
2016/12/06 PHP
PHP实现的Redis多库选择功能单例类
2017/07/27 PHP
url地址自动加#号问题说明
2010/08/21 Javascript
ASP.NET jQuery 实例3 (在TextBox里面阻止复制、剪切和粘贴事件)
2012/01/13 Javascript
对于Form表单reset方法的新认识
2014/03/05 Javascript
js数组与字符串的相互转换方法
2014/07/09 Javascript
JQuery控制Radio选中方法分析
2015/05/29 Javascript
JS使用单链表统计英语单词出现次数
2016/06/16 Javascript
深入理解js中的加载事件
2017/02/08 Javascript
基于vue实现多引擎搜索及关键字提示
2017/03/16 Javascript
node.js中EJS 模板快速入门教程
2017/05/08 Javascript
Angular2使用jQuery的方法教程
2017/05/28 jQuery
轻松玩转BootstrapTable(后端使用SpringMVC+Hibernate)
2017/09/06 Javascript
解决element UI 自定义传参的问题
2018/08/22 Javascript
微信小程序实现文字跑马灯
2020/05/26 Javascript
Node.js动手撸一个静态资源服务器的方法
2019/03/09 Javascript
原生js中运算符及流程控制示例详解
2021/01/05 Javascript
Python中处理字符串之endswith()方法的使用简介
2015/05/18 Python
Python多线程爬取豆瓣影评API接口
2019/10/22 Python
Python3爬虫中关于Ajax分析方法的总结
2020/07/10 Python
pip/anaconda修改镜像源,加快python模块安装速度的操作
2021/03/04 Python
纽约和芝加哥当天送花:Ode à la Rose
2019/07/05 全球购物
美国波西米亚风格精品店:South Moon Under
2019/10/26 全球购物
如果Session Bean得Remove方法一直都不被调用会怎么样
2012/07/14 面试题
护理专业大学生自我推荐信
2014/01/25 职场文书
幼儿园门卫岗位职责
2014/02/14 职场文书
小学生开学感言
2014/02/28 职场文书
乡镇信息公开实施方案
2014/03/23 职场文书
抗洪救灾先进集体事迹材料
2014/05/26 职场文书
2014年十一国庆节爱国演讲稿
2014/09/23 职场文书
苹果可能正在打击不进行更新的 App
2022/04/24 数码科技
详解Flutter自定义应用程序内键盘的实现方法
2022/06/14 Java/Android