这是我的小提琴。 https://jsfiddle.net/NervousElk/6scrbkex/12/。 树节点填充得很好,但是我找不到一种方法来检测用户选中/取消选中了哪个复选框。
<!DOCTYPE html>
<html>
<head>
<title>testver</title>
<link rel = "stylesheet" href="css/jstree/themes/default/style.min.css">
</head>
<body>
<script src = "jquery-3.3.1.min.js"></script>
<script src = "jquery.js"></script>
<script src = "jstree.min.js"></script>
<div id="staffallocatertree">
</div>
<button id = "treetestbtn" >Build tree
</button>
<script>
document.getElementById("treetestbtn").addEventListener("click", buildthetree);
function buildthetree()
{
//$('#staffallocatertree').jstree('refresh');
$('#staffallocatertree').jstree(
{
'plugins': [ "checkbox", "themes", "sort", "ui", "state" ],
'core' :
{
"check_callback": true,
/* 'data' :
{
"url" : "tl2_get_allstaff_as_tree.php",
"dataType" : "json"
}, */
'data' :
[
{ "id" : "ajson1", "parent" : "#", "text" : "Department 1" },
{ "id" : "ajson2", "parent" : "#", "text" : "Department 2" },
{ "id" : "ajson3", "parent" : "ajson2", "text" : "Dave" },
{ "id" : "ajson4", "parent" : "ajson2", "text" : "Jim" },
],
"checkbox": {
"three_state" : false, // to avoid that fact that checking a node also check others
"whole_node" : false, // to avoid checking the box just clicking the node
"tie_selection" : false // for checking without selecting and selecting without checking
},
//"plugins": ['checkbox']
},
})
.on("check_node.jstree uncheck_node.jstree", function(e, data)
{
alert(data.node.id + ' ' + data.node.text + (data.node.state.checked ? ' CHECKED': ' NOT CHECKED'))
})
};
</script>
</body>
</html>
填充树后,我想与复选框交互并检测节点和文本以供以后使用。为此,我试图触发check_node / uncheck_node。
感谢任何指针。
答案 0 :(得分:0)
令人惊讶的是,这似乎是open issue。
幸运的是,提供的答案有效,可以收听select_node.jstree
。
就您而言,只需更改
.on("check_node.jstree uncheck_node.jstree", function(e, data) {})
到
.on("select_node.jstree unselect_node.jstree", function(e, data) {})
希望有帮助!