Javascript 限制在jstree中选择子节点的数量

我正在使用jsTree。我想将子节点选择限制为4（不允许用户选择超过4个节点或禁用所有复选框）。我使用的选择限制不起作用。我怎样才能做到这一点

$("#mytree").jstree({ 
    "plugins" : [ "themes","html_data", "ui", "crrm","checkbox" ],
    "html_data" : {
        // ...
    },
    "checkbox": {
        "keep_selected_style": false
    },
    "ui": {
        "select_limit": 4,
    },
    // ...
});

---

按照常规方法，您可以按如下方式完成此任务

var children = document.getElementById("mytree").children;
var limit = 4;
for (var i = 0; i < limit; ++i) 
{
    if (!children[i]) return;
    children[i].classList.add("off");
}

var children=document.getElementById（“mytree”）.children；
var限值=4；
对于（变量i=0；i

按照常规方法，您可以按如下方式完成此任务

var children = document.getElementById("mytree").children;
var limit = 4;
for (var i = 0; i < limit; ++i) 
{
    if (!children[i]) return;
    children[i].classList.add("off");
}

var children=document.getElementById（“mytree”）.children；
var限值=4；
对于（变量i=0；i

我自己也遇到了这个问题

如果您使用的是jsTree v3+，“UI”插件不再存在，“select_limit”属性也不存在

---

如果您只希望一次只能选择一个选项，那么核心模块有一个“multiple”属性，您可以根据需要将其设置为true/false。但是如果你想把它限制为四个选项的话。

我自己也遇到了这个问题

如果您使用的是jsTree v3+，“UI”插件不再存在，“select_limit”属性也不存在

---

如果您只希望一次只能选择一个选项，那么核心模块有一个“multiple”属性，您可以根据需要将其设置为true/false。但是如果您想将其限制为四个选项，那么。

我也有同样的需求，并且我能够用一些java脚本找到一个解决方案。 我想检查3个节点的限制，所以我这样做：

$('#jstree')
    // listen for event
    .on('changed.jstree', function (e, data) {
            var i, j, r = [];
            var lenght = data.selected.length;


            for(i = 0, j = data.selected.length; i < j; i++) {
                 if(data.instance.get_node(data.selected[i]).type.localeCompare("child") != 0) {
                    lenght -= 1;
                }
            }


            if(lenght > 3) {

                if(data.instance.get_node(data.selected[data.selected.length-1]).type.localeCompare("child") == 0) {
                    $("#jstree").jstree("uncheck_node", data.instance.get_node(data.selected[data.selected.length-1]).id);
                } else {
                    $("#jstree").jstree("uncheck_node", data.instance.get_node(data.selected[data.selected.length-2]).id);
                }
            }
    })
    // create the instance
    .jstree({
          'core' : 
           ...

$（“#jstree”）
//倾听事件
.on（'changed.jstree'，函数（e，数据）{
var i，j，r=[]；
var lenght=data.selected.length；
对于（i=0，j=data.selected.length；i3）{
if（data.instance.get_节点（data.selected[data.selected.length-1]）type.localeCompare（“子”）==0{
$（“#jstree”）.jstree（“取消选中_节点”，data.instance.get_节点（data.selected[data.selected.length-1]）.id）；
}否则{
$（“#jstree”）.jstree（“取消选中_节点”，data.instance.get_节点（data.selected[data.selected.length-2]）.id）；
}
}
})
//创建实例
jstree先生({
“核心”：
...

我也有同样的需求，我能够用一些java脚本找到一个解决方案。 我想检查3个节点的限制，所以我这样做：

$('#jstree')
    // listen for event
    .on('changed.jstree', function (e, data) {
            var i, j, r = [];
            var lenght = data.selected.length;


            for(i = 0, j = data.selected.length; i < j; i++) {
                 if(data.instance.get_node(data.selected[i]).type.localeCompare("child") != 0) {
                    lenght -= 1;
                }
            }


            if(lenght > 3) {

                if(data.instance.get_node(data.selected[data.selected.length-1]).type.localeCompare("child") == 0) {
                    $("#jstree").jstree("uncheck_node", data.instance.get_node(data.selected[data.selected.length-1]).id);
                } else {
                    $("#jstree").jstree("uncheck_node", data.instance.get_node(data.selected[data.selected.length-2]).id);
                }
            }
    })
    // create the instance
    .jstree({
          'core' : 
           ...

$（“#jstree”）
//倾听事件
.on（'changed.jstree'，函数（e，数据）{
var i，j，r=[]；
var lenght=data.selected.length；
对于（i=0，j=data.selected.length；i3）{
if（data.instance.get_节点（data.selected[data.selected.length-1]）type.localeCompare（“子”）==0{
$（“#jstree”）.jstree（“取消选中_节点”，data.instance.get_节点（data.selected[data.selected.length-1]）.id）；
}否则{
$（“#jstree”）.jstree（“取消选中_节点”，data.instance.get_节点（data.selected[data.selected.length-2]）.id）；
}
}
})
//创建实例
jstree先生({
“核心”：
...

可能重复的您是否选中了此项？是的，我尝试了此项。不工作可能重复的您是否选中了此项？是的，我尝试了此项。不工作我尝试了上述代码。我可以选择4个以上的节点。否，它不工作。正如我所说，我可以选择4个以上的节点，如果用户尝试选择，我最多只需要选择4个节点如果再选择一个节点，则不应选择该节点您是否已将此代码段放置在“ui:”属性规范部分中，或创建了JS方法并对其进行了调用？否我没有将代码“ui”放置在“$（element）.on（'changed.jstree'）下功能。您能告诉我应该将代码准确地放置在哪里吗？请提供您是否有任何工作示例我尝试了上述代码。我可以选择4个以上的节点。不，它不工作。正如我所说，我可以选择4个以上的节点，我只需要选择最多4个节点，如果用户尝试选择一个以上的节点，该节点不应选择e您是否将这段代码放在“ui:”属性规范部分中，或创建了JS方法并调用了它？否我没有将代码“ui”放在“$（元素）下（'changed.jstree'）下函数。您能告诉我应该将代码准确放置在哪里吗？请提供您是否有任何工作示例不需要

data.instance.get_节点（data.selected[data.selected.length-1]）。id

当前节点存在于

data

object:

data.node

不需要

data.instance.get_节点（data.selected[data.selected.length-1]）.id

当前节点存在于

data

对象：

data.node