javascript - 从 jstree 获取选定节点时出错

标签 javascript jquery html jstree

我编写了显示 jstree 和复选框的程序。 我编写了一个事件,用于检查复选框是否已选中,因此当我删除该代码时, jstree 变得可见,并且当该代码存在时,树不会显示。

这是我的代码

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <style>
            html { margin:0; padding:0; font-size:62.5%; }
            body { max-width:300px; min-width:100px;  padding:20px 10px; font-size:14px; font-size:1.4em; }
            h1 { font-size:1.8em; }
            .demo { overflow:auto; border:1px solid silver; min-height:100px; }
        </style>
        <link rel="stylesheet" href="style.min.css" />
    </head>
    <body>
        <div id="frmt" class="demo"></div>


        <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
        <script src="jstree.min.js"></script>
        <button>>></button>

        <script>
            var a=[{"id":"Name 1","text":"name1","children":[{"id":"Name 2","text":"Name 2"}]}];
      </script>

        <script>
            $('#html').jstree();
            $('#frmt').jstree({
                'core': {
                    'data':a
                },
                "checkbox" : { 
            "whole_node" : false, 
            "keep_selected_style" : true, 
            "three_state" : true,
            "tie_selection" : false
          }, "search" : { 
            "fuzzy" : true
          },"plugins" : [ "checkbox", "search" ]
            });
            $('#frmt').on("changed.jstree", function (e, data) {
                console.log("Length : "+data.selected.length);
                   if(data.selected.length>0)
                   {
                       $(data.selected).each(function idx{
                          var node=data.data.instance.get_node(data.selected(idx)); 
                          console.log("Selected Node is : "+node.text);
                       });
                   }

            });
            $('button').on('click', function () {
                alert($('#frmt').jstree("get_selected"));
            });
        </script>

    </body>
</html>

因此,使用此代码,它不会显示 jstree

当我删除

        $('#frmt').on("changed.jstree", function (e, data) {
            console.log("Length : "+data.selected.length);
               if(data.selected.length>0)
               {
                   $(data.selected).each(function idx{
                      var node=data.data.instance.get_node(data.selected(idx)); 
                      console.log("Selected Node is : "+node.text);
                   });
               }

        });

它显示了树

最佳答案

每次选择和取消选择复选框都会触发该事件。 此外,您还将遍历所有节点以检查所选节点。 您可以简单地执行以下操作

var selected_nodes_list=$('#frmt').jstree("get_selected")

然后使用切片遍历这个 tis 变量的每个元素,一切就完成了。

关于javascript - 从 jstree 获取选定节点时出错,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37155977/

相关文章:

javascript - 使用 jQuery 检测屏幕尺寸并更改属性

javascript - 原型(prototype)继承和instanceof

javascript - 下拉菜单切换不适用于 ngTouch

javascript - 在 Chrome 浏览器或其他带有 URL 栏的浏览器中滚动时,如何在没有页面 'vh' 的情况下使用响应式 "jumping"尺寸

javascript - 无法从标签 jQuery 获取文本,可能是 ID 错误?

javascript - 暂停除激活的玩家之外的所有其他玩家。 <audio> 元素的 jQuery 音频插件

html - CSS 在 2 行后中断(使用相同的类)

javascript - 哪个ArrayBufferView

javascript - 如何在 AngularJS 中将查询字符串与 $location.path() 一起使用

html - Bootstrap container 或者 Well keep the well one size and enlarge text