javascript – jstree自定义节点标记

有没有办法自定义标记或添加其他html元素到某些节点.

例如,我们希望在路径下的所有节点的节点文本之后添加一个箭头(链接),当用户单击箭头时,打开上下文菜单.
我知道可以使用右键单击打开上下文菜单,但要求是在节点后面有一个箭头并单击箭头应打开上下文菜单.

有没有办法自定义或添加其他html元素到选择性树节点,并以编程方式打开上下文菜单或链接点击事件.

解决方法:

实现此目的的最佳方法是使用插件,您可以在此处查看类似的示例插件：https://github.com/vakata/jstree/blob/master/src/misc.js(例如,问号插件).

这是一个粗略的演示,根据需要进行修改：http://jsfiddle.net/DGAF4/490/

(function ($, undefined) {
    "use strict";
    var img = document.createElement('IMG');
    img.src = "http://jstree.com/tree-icon.png";
    img.className = "jstree-contextmenubtn";

    $.jstree.plugins.contextmenubtn = function (options, parent) {
        this.bind = function () {
            parent.bind.call(this);
            this.element
                .on("click.jstree", ".jstree-contextmenubtn", $.proxy(function (e) {
                        e.stopImmediatePropagation();
                        $(e.target).closest('.jstree-node').children('.jstree-anchor').trigger('contextmenu');
                    }, this));
        };
        this.teardown = function () {
            this.element.find(".jstree-contextmenubtn").remove();
            parent.teardown.call(this);
        };
        this.redraw_node = function(obj, deep, callback, force_draw) {
            obj = parent.redraw_node.call(this, obj, deep, callback, force_draw);
            if(obj) {
                var tmp = img.cloneNode(true);
                obj.insertBefore(tmp, obj.childNodes[2]);
            }
            return obj;
        };
    };
})(jQuery);

标签：javascript,jstree
来源： https://codeday.me/bug/20190717/1489526.html