在Jstree中获取所有选定值的数组

发布于 2025-02-07 21:00:17 字数 2473 浏览 5 评论 0原文

我有一个使用JSTREE插件与插件一起使用的程序。带有层次数据的JSON文件用作输入。您可以在下面看到此程序的代码示例。

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Simple jsTree</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var jsondata = [
                           { "id": 1, "parent": "#", "text": "Math" ,"icon":false},
                           { "id": 2, "parent": 1, "text": "Algebra","icon":false },
                           { "id": 3, "parent": 2, "text": "Polynomials","icon":false },
                           { "id": 4, "parent": 3,"disabled":true, "text": "sum of polynomials","icon":false },
                           { "id": 5, "parent": "#", "text": "Physics","icon":false },
                           { "id": 6, "parent": 5, "text": "Mechanics","icon":false },
                           { "id": 7, "parent": 6, "text": "Kinematics","icon":false },
                           { "id": 8, "parent": 6, "text": "Dynamics","icon":false },
            ];

            createJSTree(jsondata);
        });

        function createJSTree(jsondata) {
            $('#SimpleJSTree').jstree({
                "core": {                    
                    'data': jsondata,
                    "multiple" : false
                },
                "plugins": ["search", "checkbox"],
                "search": {
                    "case_sensitive": false,
                    "show_only_matches": true
                }
            });
        }

        $(document).ready(function () {
            $(".search-input").keyup(function () {
                var searchString = $(this).val();
                $('#SimpleJSTree').jstree('search', searchString);
            });
        });
        
    </script>
</head>
<body>
    <input id="search-input" class="search-input" />
    <br />
    <div id="SimpleJSTree"></div>
</body>
</html>

我需要获取所有选定值的ID数组。我应该如何解决这个问题

I have a program that works with a plugin using the jstree plugin. A json file with hierarchical data is used as input. You can see an example of the code for this program below.

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title>Simple jsTree</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/themes/default/style.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jstree/3.2.1/jstree.min.js"></script>
    <script type="text/javascript">
        $(function () {
            var jsondata = [
                           { "id": 1, "parent": "#", "text": "Math" ,"icon":false},
                           { "id": 2, "parent": 1, "text": "Algebra","icon":false },
                           { "id": 3, "parent": 2, "text": "Polynomials","icon":false },
                           { "id": 4, "parent": 3,"disabled":true, "text": "sum of polynomials","icon":false },
                           { "id": 5, "parent": "#", "text": "Physics","icon":false },
                           { "id": 6, "parent": 5, "text": "Mechanics","icon":false },
                           { "id": 7, "parent": 6, "text": "Kinematics","icon":false },
                           { "id": 8, "parent": 6, "text": "Dynamics","icon":false },
            ];

            createJSTree(jsondata);
        });

        function createJSTree(jsondata) {
            $('#SimpleJSTree').jstree({
                "core": {                    
                    'data': jsondata,
                    "multiple" : false
                },
                "plugins": ["search", "checkbox"],
                "search": {
                    "case_sensitive": false,
                    "show_only_matches": true
                }
            });
        }

        $(document).ready(function () {
            $(".search-input").keyup(function () {
                var searchString = $(this).val();
                $('#SimpleJSTree').jstree('search', searchString);
            });
        });
        
    </script>
</head>
<body>
    <input id="search-input" class="search-input" />
    <br />
    <div id="SimpleJSTree"></div>
</body>
</html>

I need to get array of ids of all selected values. How should I solve this problem

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

梦幻的心爱 2025-02-14 21:00:17

我会尝试,例如,在事件select_node

$("#SimpleJSTree")
  .on("select_node.jstree", function(e, data) {
    for(var i = 0; i < data.selected.length; i++) {
      var id = data.instance.get_node(data.selected[i]).id;
      console.log(id);
    }
  });

I would try, for example on the event select_node:

$("#SimpleJSTree")
  .on("select_node.jstree", function(e, data) {
    for(var i = 0; i < data.selected.length; i++) {
      var id = data.instance.get_node(data.selected[i]).id;
      console.log(id);
    }
  });
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文