gpt4 book ai didi

jquery - 从 html 数据中选中的 jsTree 复选框

转载 作者:搜寻专家 更新时间:2023-10-31 08:18:07 25 4
gpt4 key购买 nike

我有一个 ajax 请求返回数据以显示带有复选框的树。在从 ajax 调用返回的 de html 数据中,项目的检查状态是使用自定义数据检查状态属性定义的。如何在树中恢复此检查状态?

预期结果:

expected result

<head>
<meta charset="utf-8" />
<title>JsTree test</title>

<link rel="stylesheet" href="http://static.jstree.com/latest/assets/dist/themes/default/style.min.css" />
<script src="http://static.jstree.com/latest/assets/dist/libs/jquery.js"></script>
<script src="http://static.jstree.com/latest/assets/dist/jstree.min.js"></script>
</head>
<body>
<div id="container"/>
</body>
</html>

<script>
$(function () {
var ajaxResponse =
'<ul> <li data-checkstate="undetermined">Parent 1' +
' <ul>' +
' <li data-checkstate="unchecked">Child 1a' +
' <ul>' +
' <li data-checkstate="unchecked">Grantchild 1a1</li>' +
' <li data-checkstate="unchecked">Grantchild 1a2</li>' +
' </ul>' +
' </li>' +
' <li data-checkstate="undetermined">Child 1b' +
' <ul>' +
' <li data-checkstate="unchecked">Grantchild 1b1</li>' +
' <li data-checkstate="checked">Grantchild 1b2</li>' +
' </ul>' +
' </li>' +
' </ul>' +
'</li>' +
'<li data-checkstate="unchecked">Parent 2' +
' <ul>' +
' <li data-checkstate="unchecked">Child 2a' +
' <ul>' +
' <li data-checkstate="unchecked">Grantchild 2a1</li>' +
' <li data-checkstate="unchecked">Grantchild 2a2</li>' +
' </ul>' +
' </li>' +
' <li data-checkstate="unchecked">Child 1b' +
' <ul>' +
' <li data-checkstate="unchecked">Grantchild 2b1</li>' +
' <li data-checkstate="unchecked">Grantchild 2b2</li>' +
' </ul>' +
' </li>' +
' </ul>' +
'</li> </ul>';

var tree = $("#container");
tree.html(ajaxResponse);
tree.on('loaded.jstree', function () {
// restore tree state
$('li[data-checkstate="checked"]').each(function () {
$(this).addClass('jstree-checked');
});
$('li[data-checkstate="undetermined"]').each(function () {
$(this).addClass('jstree-undetermined');
});
});

tree.jstree({
plugins: ["checkbox"],
core: {
"themes": {
"icons": false
}
}
});
});
</script>

更新:编辑:移至答案

最佳答案

我知道这是旧的,但可能对某些人有帮助。

要在通过 HTML 加载时选中复选框,请像示例中那样设置类:

<li id="123">
<a href="#" class="jstree-clicked">Click me</a>
</li>

关于jquery - 从 html 数据中选中的 jsTree 复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25054001/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com