jstree自定義節點標記

有沒有一種方法可以自定義標記或添加額外的HTML元素的一些節點。jstree自定義節點標記

例如，我們希望在路徑下的所有節點的節點文本之後添加一個箭頭（鏈接），並且當用戶單擊箭頭時，打開上下文菜單。我知道可以使用右鍵單擊打開上下文菜單，但是需要在節點後單擊箭頭並打開上下文菜單後纔有箭頭。

有沒有一種方法來定製或添加額外的HTML元素到選擇樹節點，並以編程方式打開上下文菜單或鏈接點擊事件。

2015-05-06 Sudhir N

實現這一目標的最佳方法是使用插件，您可以在這裏查看類似的示例插件：https://github.com/vakata/jstree/blob/master/src/misc.js（例如questionmark插件）。

這裏是一個粗略的演示，根據需要修改：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);

來源

2015-05-07 08:38:53 vakata

非常感謝，是的，我看了你的答案之一在郵件列表上，我正在看問題插件，看着你的jsfiddle，這正是我所期待的。然而，還有一件事我不知道，它顯示了每個節點的圖像按鈕，但是我只需要爲certrain節點顯示imgbutton。裏面redraw_node我怎麼能得到節點，或節點的原始json數據？所以我可以有條件地做obj.insertBefore –

嘗試註銷'console.log（this.get_node（obj））;'之前調用父函數（作爲'redraw_node'函數的第一行。它應該是你需要的 – vakata

如何更改上下文菜單的位置/座標？@vakata –

隨着jstree 3.3.0版本，你可以使用node_customize plugin

$("#category-tree").jstree({ 
    core: { 
    data: nodes 
    }, 
    node_customize: { 
    default: function(el, node) { 
     $(el).find('a').append(arrowHtml) 
    } 
    }, 
    plugins: ['node_customize'] 
})

來源

2018-02-01 11:05:52 Hirurg103

jstree自定義節點標記

回答

相關問題