如何使用JSTREE选择属于特定树(级别)的节点

脊柱肌

我正在尝试制定一条规则,使用户仅选择属于特定树的节点;用户不必像这样从不同级别选择多个节点:

问题

你知道怎么做吗?

提前致谢。

脊柱肌

如果有人遇到相同的问题,我就找到了解决方案:

html部分:

<div id="jstree"/>

JavaScript部分:

$(function() {$("#jstree").on("select_node.jstree", function (evt, data) {

  var selectedNode= $('#jstree').jstree(true).get_selected(true);

  for(var i = 0, j = selectedNode.length; i < j; i++) {

    if(selectedNode.length > 1){

        var res = selectedNode[i].parents[selectedNode[i].parents.length-2];

      if(data.node.parent != res){
            $('#jstree').jstree("deselect_all");
      }

    }

  }

});

$('#jstree').jstree({
    'core': {

        'data': [{
            "id": "1.0",
            "text": "Fresh Products",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [{
                "id": "2.06.0",
                "text": "Ethnic & Specialty",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": [{
                "id": "2.16.0",
                "text": "Ethnic & Specialty",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.17.0",
                "text": "Natural & Organic",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.07.0",
                "text": "Natural & Organic",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.08.0",
                "text": "Prepared Foods",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.09.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }, {
                "id": "2.010.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "2.0",
            "text": "Frozen Products",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "3.0",
            "text": "Store Equipment ",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "4.0",
            "text": "Packaged Grocery",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "5.0",
            "text": "Retail Technology",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [],
            "liAttributes": null,
            "aAttributes": null
        }, {
            "id": "6.0",
            "text": "HBC/Non-Foods",
            "icon": "",
            "state": {
                "opened": false,
                "disabled": false,
                "selected": false
            },
            "children": [{
                "id": "2.090.0",
                "text": "Seafood",
                "icon": "",
                "state": {
                    "opened": false,
                    "disabled": false,
                    "selected": false
                },
                "children": false,
                "liAttributes": null,
                "aAttributes": null
            }],
            "liAttributes": null,
            "aAttributes": null
        }]



    },
    "search": {

        "case_insensitive": true,
        "show_only_matches" : true


    },

    "plugins": ["search"]


});

});

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用jstree插件显示选择的树

来自分类Dev

获取特定级别的所有节点JsTree Jquery

来自分类Dev

在树中的特定位置上创建JSTree节点

来自分类Dev

jsTree:遍历树时如何获取节点的元数据?

来自分类Dev

jsTree:遍历树时如何获取节点的元数据?

来自分类Dev

检查是否使用C#在Telerik RadtreeControl中选择了特定级别中的所有节点

来自分类Dev

使用python 2.7和XML元素树在XML中选择具有特定元素值的节点

来自分类Dev

如何使jstree仅在单击鼠标左键时选择节点?

来自分类Dev

在树中的特定位置上创建一个JSTree节点

来自分类Dev

防止jsTree节点选择

来自分类Dev

如何根据特定值突出显示jsTree节点?

来自分类Dev

如何在JavaFX节点树中找到特定的节点?

来自分类Dev

隐藏JSTree中的特定节点

来自分类Dev

如何重绘树(jstree)

来自分类Dev

第一次显示树时如何显示选中的jstree节点?

来自分类Dev

如何使用Python获取树的叶子节点?

来自分类Dev

获取特定级别的二叉树的所有节点

来自分类Dev

获取特定级别的二叉树的所有节点

来自分类Dev

使用LINQ在相同级别上选择多个节点

来自分类Dev

使用LINQ在相同级别上选择多个节点

来自分类Dev

如何使用jstree更改按钮单击时节点的位置?

来自分类Dev

使用jstree ui时,如何单击jstree中的叶节点以打开其超链接?

来自分类Dev

如何使用JQuery选择器选择HTML Dom中的特定子节点?

来自分类Dev

如何使用JQuery选择器选择HTML Dom中的特定子节点?

来自分类Dev

JsTree-面板隐藏时选择节点

来自分类Dev

XPath:如何选择节点的特定属性值?

来自分类Dev

道场树选择节点问题

来自分类Dev

在powershell中使用xpath选择特定节点

来自分类Dev

如何在树中链接同一级别的所有节点

Related 相关文章

  1. 1

    使用jstree插件显示选择的树

  2. 2

    获取特定级别的所有节点JsTree Jquery

  3. 3

    在树中的特定位置上创建JSTree节点

  4. 4

    jsTree:遍历树时如何获取节点的元数据?

  5. 5

    jsTree:遍历树时如何获取节点的元数据?

  6. 6

    检查是否使用C#在Telerik RadtreeControl中选择了特定级别中的所有节点

  7. 7

    使用python 2.7和XML元素树在XML中选择具有特定元素值的节点

  8. 8

    如何使jstree仅在单击鼠标左键时选择节点?

  9. 9

    在树中的特定位置上创建一个JSTree节点

  10. 10

    防止jsTree节点选择

  11. 11

    如何根据特定值突出显示jsTree节点?

  12. 12

    如何在JavaFX节点树中找到特定的节点?

  13. 13

    隐藏JSTree中的特定节点

  14. 14

    如何重绘树(jstree)

  15. 15

    第一次显示树时如何显示选中的jstree节点?

  16. 16

    如何使用Python获取树的叶子节点?

  17. 17

    获取特定级别的二叉树的所有节点

  18. 18

    获取特定级别的二叉树的所有节点

  19. 19

    使用LINQ在相同级别上选择多个节点

  20. 20

    使用LINQ在相同级别上选择多个节点

  21. 21

    如何使用jstree更改按钮单击时节点的位置?

  22. 22

    使用jstree ui时,如何单击jstree中的叶节点以打开其超链接?

  23. 23

    如何使用JQuery选择器选择HTML Dom中的特定子节点?

  24. 24

    如何使用JQuery选择器选择HTML Dom中的特定子节点?

  25. 25

    JsTree-面板隐藏时选择节点

  26. 26

    XPath:如何选择节点的特定属性值?

  27. 27

    道场树选择节点问题

  28. 28

    在powershell中使用xpath选择特定节点

  29. 29

    如何在树中链接同一级别的所有节点

热门标签

归档