在 JSTree 中选择列表项时选择复选框答案

【问题标题】：Selecting Checkbox when Selecting List Item in JSTree在 JSTree 中选择列表项时选择复选框
【发布时间】：2019-04-19 10:23:40
【问题描述】：

我目前有一个 JSTree，它显示列表项，其中包含复选框。

我的目标：将选定的列表项值发送到 PHP POST 表单中。

这就是我在我的网站上回应它们的方式：

echo '<li id="dynamicID"><input name="checkboxname" type="checkbox" id="SameIdThanListItemID" value="checkboxvalue">List item text</li>

这工作正常，我的列表项按预期显示。

我们首先检查了列表项，然后是 JSTree 图标，然后是我必须用于提交帖子的复选框输入（此复选框将被隐藏）。无法单击复选框，我认为这是由于 JSTree 行为。

树当前设置为禁用多选，因此我们不会遇到与数组相关的问题。我们永远不会处理多个 ID。

当我试图在单击列表项时选中复选框时出现问题。

    $("#tree").bind("changed.jstree",

        function (e, data) {       

        var nodeId = $('#tree').jstree().get_selected("id")[0].id;

        // Shows up the proper ID selected, and both checkbox and 
        // list item have the same ID, so we're good untill here
        console.log(nodeId); 

        // We've got the ID properly stored into nodeId,and we've checked it with console.Log, 
        // however, the input checkbox its never getting selected.
        document.getElementById(nodeId).checked = true;

        }
    );

【问题讨论】：

如果你已经有了元素，那为什么又要通过ID来获取呢？这似乎没有必要。
你说得对，我们可以直接处理 ID。但是，即使我们在那里失踪；它仍然应该检查。它没有解决问题。

标签： javascript jstree

【解决方案1】：

我发现如果复选框位于 JSTree <li></li> 标签内，它们将无法被选中/取消选中。

为了解决这个问题，我只是在树外创建了一个循环，并在隐藏的 div 中回显每个复选框。现在选择列表项也会选中正确的复选框，因此帖子提交按预期工作。

【讨论】：