jsTree组件后台菜单？

Question

在 jsTree 组件中提供了一个 ContextMenu 插件。

但只有在用户点击特定节点时才可用。

我需要通过单击组件的背景来添加上下文菜单（例如添加根节点）。

是否可以为背景附加上下文菜单插件？

Answer 1

可以，但是您需要定义所有可用的操作，因为默认值与节点相关，因此它们不起作用（重命名、删除等）。

这将在单击树容器时显示一个菜单，并显示一个用于创建根节点的选项：

$('#tree').on('contextmenu.jstree', function (e) {  
    e.preventDefault();
    if($(e.target).is('#tree')) {
        $(document).one("context_show.vakata.jstree", $.proxy(function (e, data) {
            var cls = 'jstree-contextmenu jstree-default-contextmenu';
            $(data.element).addClass(cls);
        }, this));
        $.vakata.context.show($(this), { 'x' : e.pageX, 'y' : e.pageY }, {
            "create" : {
                "separator_before"  : false,
                "separator_after"   : false,
                "_disabled"         : false,
                "label"             : "Create",
                "action"            : function (data) {
                    var inst = $.jstree.reference(e.target);
                    inst.create_node(null, {}, "last", function (new_node) {
                        setTimeout(function () { inst.edit(new_node); },0);
                    });
                }
            }
        });
    }
});

jsTree组件后台菜单？

jsTree component background menu?

jstree