jquery 树形表格控件

jQuery树形表格控件是一种前端开发工具，它允许开发者以树状结构展示具有层级关系的数据，适用于需要展示层次结构数据的场景，如组织结构或目录结构。以下是关于jQuery树形表格控件的相关信息：

基本概念

定义：jQuery树形表格控件是一种基于jQuery的插件，用于创建可折叠和展开的树形菜单结构或表格。
组成：通常由Tree（树）组件和DataGrid（数据表格）组件组合而成，继承了两者的特性。

优势

兼容性好：支持IE6及以上版本，以及其他主流浏览器。
接口简洁：在普通表格的基础上增加父子关系的自定义标签即可实现树形结构。
性能高：内部实现了只绑定了表格的事件，使用了CSS Sprites合并图片等优化技术。
风格多样：提供两种风格设置，通过参数来设置风格。

类型

jQuery Treeview：一个常见的插件，用于创建可折叠和展开的树形菜单结构。
jQuery EasyUI Tree：基于jQuery EasyUI的树形组件，提供丰富的操作和事件处理功能。

应用场景

文件系统展示
下拉菜单
组织机构展示等。

示例代码

jQuery Treeview 示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>jQuery Treeview 示例</title>
    <link rel="stylesheet" href="path/to/jquery.treeview.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="path/to/jquery.treeview.js"></script>
</head>
<body>
    <ul id="myTree">
        <li>节点 1
            <ul>
                <li>子节点 1.1</li>
                <li>子节点 1.2</li>
            </ul>
        </li>
        <li>节点 2
            <ul>
                <li>子节点 2.1</li>
                <li>子节点 2.2
                    <ul>
                        <li>子节点 2.2.1</li>
                        <li>子节点 2.2.2</li>
                    </ul>
                </li>
            </ul>
        </li>
        <li>节点 3</li>
    </ul>
    <script>
    $(document).ready(function() {
        $("#myTree").treeview({
            collapsed: true,
            animated: "fast",
            control: "#treecontrol",
            persist: "location"
        });
        $('<button id="treecontrol">切换</button>').prependTo('#myTree');
    });
    </script>
</body>
</html>

jQuery EasyUI Tree 示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Tree Example</title>
    <link rel="stylesheet" href="themes\material\easyui.css">
    <script src="jquery.min.js"></script>
    <script src="jquery.easyui.min.js"></script>
</head>
<body>
    <ul id="tt" class="easyui-tree" data-options="url:'tree_data.json',method:'get',lines:true"> </ul>
    <script>
    $(function(){
        $('#tt').tree({
            checkbox: true,
            cascadeCheck: false,
            onSelect: function(node){
                alert('Selected: ' + node.text);
            }
        });
    });
    </script>
</body>
</html>

通过上述示例，你可以看到如何使用jQuery Treeview和jQuery EasyUI Tree来创建树形结构，并设置一些基本的属性和事件处理。这些示例展示了如何加载数据、处理节点选择和展开/折叠操作。

希望这些信息对你有所帮助！如果你有更多具体的问题或需要进一步的帮助，请随时告诉我。

页面内容是否对你有帮助？

有帮助

没帮助

jsp、拖放、mysql、treeview

、、、

我正在使用JSP。现在假设我在mysql中有三个相关的表，如下所示所以我们可以有许多部门，每个部门可以有尽可能多的项目，每个项目都会有成员……现在我想设计我的JSP页面，如下所示 -ProjectA >>Person2 >>Person12+DepartmentB我希望它在视觉上看起来如图所示，如treeview。我还希望能够重命名

浏览 1提问于2011-05-31得票数 1

回答已采纳

5回答

jquery最好地控制生成的树

好的，谁能告诉我jquery中最好的树形视图控件？除了dynatree

浏览 1提问于2010-05-23得票数 5

回答已采纳

3回答

常用的最好的JQuery控件是什么？

、、

最常用的JQuery/Javascript控件是什么？我正在寻找基本的:网格，日历，日期选择器，谷歌建议的类似文本框，等等…最好是以jQueryUI为主题。我正在寻找的主要控件是客户端替代Telerik ASP.NET AJAX RadGrid，调度和编辑器，树形视图控件等…

浏览 1提问于2011-04-28得票数 0

回答已采纳

2回答

标准JS GUI控件库

、、、

就JS库而言，我们有像jQuery这样的标准来制作我们自己的工具，但是有没有被广泛使用的可重用控件库，来弥补JTML中不支持的所有标准图形用户界面控件？例如滑块、树控件等。在网上搜索，我可以找到101个免费版本的任何给定的控件，但一个完善的库将会更好。

浏览 31提问于2011-03-11得票数 1

回答已采纳

1回答

Reg HTML5树视图控件

我需要树形视图控件。html中有没有treeview控件？有人能在这方面帮我吗。

浏览 1提问于2011-11-23得票数 0

1回答

ASP.NET在两个列表框之间拖放

、、、、

我想用jQuery来做这件事...也许可以使用jQuery UI Droppable插件？提前感谢！

浏览 3提问于2011-08-17得票数 2

1回答

Clarity datagrid嵌套组件在升级到1.0.2后中断

、

由于没有清晰的树形表格，开发的树形表格控件看起来像清晰的Datagrid。我使用了Datagrid并对其进行了调整(创建了一个用于包装行和嵌套行的自定义组件)，在几次CSS覆盖之后，它成功了。

浏览 12提问于2019-01-09得票数 1

4回答

在asp.net 2.0中创建嵌套复选框

、、

在ASP.net中创建嵌套检查框列表的最佳方法是什么？我在datatable中有所需的数据，并希望遍历它以创建一个checkboxlist，其中为每个父复选框嵌套了checkboxlist。

浏览 5提问于2009-02-25得票数 1

回答已采纳

1回答

lightswitch使用javascript创建自定义表格/列表

、、、

我需要在HTML客户端中使用javascript在lightswitch中创建一个表或列表，其中填充了我自己的自定义数据，这些数据不是来自查询。谢谢!

浏览 3提问于2015-06-22得票数 0

2回答

对于业务应用程序来说，Canvas是否过度杀伤力？

我正在构建一个主要涉及表格和其他典型表单元素的业务应用程序。然而，由于我的应用程序的性质，我需要将这些元素的组放在一个动态的树形结构中，这将占用所有可用的屏幕空间。

浏览 4提问于2011-04-14得票数 3

回答已采纳

1回答

选择菜单项时，在窗口中显示内容的UI设计模式是什么？

我有一个表格的菜单。当用户选择一个菜单选项时，我想要显示一些元素，如网格、树形视图或分组的UI元素。我到处寻找示例应用程序，但我找不到任何有菜单的应用程序。有什么想法吗？

浏览 3提问于2015-02-13得票数 0

2回答

为什么在treeview控件中单击复选框时无法获得事件？

、、

在我的MFC对话框中，我有一个带有复选框的树形视图控件。单击复选框不会引发NM_CLICK或TVN_SELCHANGED事件，这是我所希望的。如何正确确定树形视图控件中的复选框何时被选中/取消选中？

浏览 3提问于2010-08-03得票数 1

回答已采纳

2回答

Delph/Builder拖放图像，图像在离开控件时消失

、、

我有一个实现拖放的树形控件。我使用一个被覆盖的OnStartDrag()来获得我自己的TDragObjectEx，它在拖动时显示一个图像。这在树形控件中工作得很好，但是一旦我离开树形控件，图像就消失了。不过，光标会留在原处。对此有什么提示吗？更新:发现在表单控件中的每个控件上设置csDisplayDragImage，并且在表单本身中解决了这个问题。

浏览 0提问于2010-02-09得票数 3

回答已采纳

2回答

ASP.net:对一个网格视图进行分页会导致其他网格视图重新加载

、

我在三个独立的jQuery UI选项卡中有两个网格和一个树形视图。每次我翻页我的gridview，这是一个继承自Gridview的自定义控件，其他的标签页都会刷新。我怎么才能阻止它呢？

浏览 2提问于2010-10-02得票数 0

回答已采纳

1回答

SharePoint讨论列表TreeView可视webpart部件

、、、

正在尝试创建可视化webpart部件以将SharePoint 2010讨论板呈现为树视图。我可以将所有主题作为父节点返回，将每个主题的所有回复作为子节点返回，但不能以层次结构返回。因此，所有回复(甚至是对早期回复的回复)都在同一节点级别上。有一个名为ThreadIndex的属性，可用于跟踪层次结构上的回复级别(是第一个回复，还是对第一个回复的回复，或者{回复第一个回复的回复}等等。两行之间的长数字是threadingindex值。您可以看到first reply如何具有特定的线程索引值，而reply如何具有其线程索引值并附加一些随机字符串。这就是我想要的样子：有人能给我

浏览 1提问于2012-10-17得票数 0

1回答

发送消息TVM_EDITLABEL失败

TreeView_EditLabel(tv, item)失败(返回零)。有什么问题吗？有什么先决条件吗？还是根本不起作用？下面是一个最小可重现性的例子#include <CommCtrl.h>HTREEITEM hItem; auto className = L"s

浏览 4提问于2020-06-14得票数 1

回答已采纳

2回答

如何将HTML CSS设计应用于TreeView控件

、、、、

我在ASP.NET中有一个动态创建的树形视图控件，我想格式化这个树形视图控件，并应用一些设计。我在stackoverflow上发现了这一点，但我不知道我是否可以应用于动态创建的Treeview控件？TreeView1" runat="server" ShowLines="true">请让我知道如何将此样式应用于动态添加的treeview控件

浏览 1提问于2015-08-12得票数 0

1回答