treetable php,jQuery树型表格插件jQuery treetable

treetable php,jQuery树型表格插件jQuery treetable插件描述:jQuery-treetable是一个jQuery插件。有了这个插件,你可以在一个HTML表格中显示树,即目录结构或嵌套列表。它使你的HTML文件干净的,展现出树状表格插件,你只需要每一行数据添加特定的数据属性。jQuery-treetable有了这个插件,你可以在一个HTML表格中显示树,即目录结构或嵌套列表。它使你的HTML文件干净的,展现出树状表格插件,你只需要每一行数据添加特定的…

大家好,又见面了,我是你们的朋友全栈君。

3460565fc949a84bccb6f4a578cbc54f.png

8d356dd126880af192ae902c3e671bd1.png

插件描述:jQuery-treetable是一个jQuery插件。有了这个插件,你可以在一个HTML表格中显示树,即目录结构或嵌套列表。它使你的HTML文件干净的,展现出树状表格插件,你只需要每一行数据添加特定的数据属性。

jQuery-treetable

有了这个插件,你可以在一个HTML表格中显示树,即目录结构或嵌套列表。它使你的HTML文件干净的,展现出树状表格插件,你只需要每一行数据添加特定的数据属性。该插件使用这些属性来确定你的树看起来像。 特点 它可以显示在表列中的数据树。 它可以折叠和展开想到的目录结构。 它支持无限制树的深度。

使用方法

引用所需要的文件

初始化插件

$(“#your_table_id”).treetable();

支持拖拽$(“#example-advanced”).treetable({ expandable: true });

// Highlight selected row

$(“#example-advanced tbody tr”).mousedown(function() {

$(“tr.selected”).removeClass(“selected”);

$(this).addClass(“selected”);

});

// Drag & Drop Example Code

$(“#example-advanced .file, #example-advanced .folder”).draggable({

helper: “clone”,

opacity: .75,

refreshPositions: true,

revert: “invalid”,

revertDuration: 300,

scroll: true

});

$(“#example-advanced .folder”).each(function() {

$(this).parents(“tr”).droppable({

accept: “.file, .folder”,

drop: function(e, ui) {

var droppedEl = ui.draggable.parents(“tr”);

$(“#example-advanced”).treetable(“move”, droppedEl.data(“ttId”), $(this).data(“ttId”));

},

hoverClass: “accept”,

over: function(e, ui) {

var droppedEl = ui.draggable.parents(“tr”);

if(this != droppedEl[0] && !$(this).is(“.expanded”)) {

$(“#example-advanced”).treetable(“expandNode”, $(this).data(“ttId”));

}

}

});

});

样式自定义 默认使用的文件样式表jquery.treetable.theme.default.css的,你也可以自定义自己的风格的模板。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/134742.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)
blank

相关推荐

  • Perl正则表达式超详细教程

    Perl正则表达式超详细教程前言想必学习perl的人,对基础正则表达式都已经熟悉,所以学习perl正则会很轻松。这里我不打算解释基础正则的内容,而是直接介绍基础正则中不具备的但perl支持的功能。关于基础正则表达式的内容,可参阅基础正则表达式。我第一个要说明的是,perl如何使用正则。还记得当初把《精通正则表达式》的书看了一遍,把perl正则也学了个七七八八,但是学完后却不知道怎么去使用perl正则,虽然里面也介绍了一点…

  • 2018一战硕士考研风雨路「建议收藏」

    2018一战硕士考研风雨路「建议收藏」写以此文,记录我在考研过程中的收获。(注:文章将以日记体形式呈现,文章较长,请耐心阅读)2017.7.10:考研生涯第一天今天开始我在家考研生涯的第一天,怎么说呢,这个结果还是感到有些意外的,因为我本来是计划留校学习的,但学校今年很特殊,要封校,无奈我经过认真考虑后,还是决定回家复习。第一天本想着调整下时差,早上七点起的,结果还是老样子八点半醒来了,洗漱了一下,吃完老妈做的早饭,于…

  • mysql中文乱码

    mysql中文乱码

  • c++ vector下标_vectorat

    c++ vector下标_vectoratC语言(加了层语法糖的汇编)为了性能并不支持数组的越界检查,每次检查会多付出2-3倍的时间。而vector以at的形式支持越界检查,但也支持C语言风格的[]高效访问,没错C++提供了足够的自由。当要获取std::vector的第n个元素,下面几种方式都可以:  std::vector<int>vec; size_tn=1; in…

  • iOS 单元測试之XCTest具体解释(一)[通俗易懂]

    iOS 单元測试之XCTest具体解释(一)

  • navicat激活码生成不了怎么回事[最新免费获取]「建议收藏」

    (navicat激活码生成不了怎么回事)这是一篇idea技术相关文章,由全栈君为大家提供,主要知识点是关于2021JetBrains全家桶永久激活码的内容IntelliJ2021最新激活注册码,破解教程可免费永久激活,亲测有效,下面是详细链接哦~https://javaforall.cn/100143.html0BXA05X8YC-eyJsaWN…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号