jsTree多次加载树,点击树节点的时候出问题了

发布于 2021-11-27 17:16:25 字数 8516 浏览 816 评论 0

用的是jsTree0.9.8:
tree_component.css
jquery-1.6.4.min.js
css.js
tree_component.js
下面是创建树的js代码:

<script type="text/javascript">
 function createTree(){
 var conf = {
            data  : {
                type  : "json",
                json  : [
                    { attributes: { id : "pjson4_1" }, data: "Tree1 node 1", children : [
                        { attributes: { id : "pjson4_2" }, data: { title : "Custom icon" } },
                        { attributes: { id : "pjson4_3" }, data: "Child node 2" },
                        { attributes: { id : "pjson4_4" }, data: "Some other child node" }
                    ]},
                    { attributes: { id : "pjson4_5" }, data: "Tree1 node 2" }
                ]
            },
       ui : {
                theme_name : "checkbox"
            },
            callback : {
                onchange : function (NODE, TREE_OBJ) {
                    alert(1);
                    if(TREE_OBJ.settings.ui.theme_name == "checkbox") {
                        var $this = $(NODE).is("li") ? $(NODE) : $(NODE).parent();
                        if($this.children("a.unchecked").size() == 0) {
                            TREE_OBJ.container.find("a").addClass("unchecked");
                        }
                        $this.children("a").removeClass("clicked");
                        if($this.children("a").hasClass("checked")) {
                            $this.find("li").andSelf().children("a").removeClass("checked").removeClass("undetermined").addClass("unchecked");
                            var state = 0;
                        }
                        else {
                            $this.find("li").andSelf().children("a").removeClass("unchecked").removeClass("undetermined").addClass("checked");
                            var state = 1;
                        }
                        $this.parents("li").each(function () {
                            if(state == 1) {
                                if($(this).find("a.unchecked, a.undetermined").size() - 1 > 0) {
                                    $(this).parents("li").andSelf().children("a").removeClass("unchecked").removeClass("checked").addClass("undetermined");
                                    return false;
                                }
                                else $(this).children("a").removeClass("unchecked").removeClass("undetermined").addClass("checked");
                            }
                            else {
                                if($(this).find("a.checked, a.undetermined").size() - 1 > 0) {
                                    $(this).parents("li").andSelf().children("a").removeClass("unchecked").removeClass("checked").addClass("undetermined");
                                    return false;
                                }
                                else $(this).children("a").removeClass("checked").removeClass("undetermined").addClass("unchecked");
                            }
                        });
                    }
                }
            }
 };
 if($(this).data('tree')){
     var demoTree = $(this).data('tree');
     demoTree.destroy();
     demoTree.init($("#demo"), $.extend({},conf));
 }else{
    var demoTree = $.tree_create();
           $(this).data('tree',demoTree);
           demoTree.init($("#demo"), $.extend({},conf));
 }
};
</script>

问题:

第一次点击创建树的按钮,可以创建带checkbox的树,点击checkbox也是可以正常选择的
但是之后再点击创建树的按钮,checkbox就无法正常勾选
我再onchange里面加了alert(1)方法,第二次创建树时,checkbox每点击一次,onchange执行了二次,第三次创建树时,onchange就执行三次......

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文