jsTree上下文菜單問題

Question

這應該是一個非常簡單的問題，但我似乎無法在任何地方找到答案。 我最近（就像今天一樣）開始使用 jsTree 並且我剛剛建立了我的第一棵樹。 我創建了一個僅包含 static 文本的無序列表：

<ul>
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ul>

我的 jsTree 代碼如下所示：

$(document).ready(function () {
        $("#demo1").bind("select_node.jstree",
                function(event, data) {
                    //DO SOMETHING WHEN A NODE IS CLICKED
                }).jstree();
});

然后我嘗試添加一個上下文菜單。 使用以下內容：

$(document).ready(function () {
        $("#demo1").bind("select_node.jstree",
                function(event, data) {
                    //DO SOMETHING WHEN A NODE IS CLICKED
                }).jstree({plugins: ["contextmenu"], contextmenu: {items: customMenu}});
    });

customMenu 是一個簡單的 function，它返回一個 object。

當我執行第一個代碼時，我得到了我的 jsTree，它會折疊和展開。 當我執行第二個時，jsTree 所在的區域會顯示“正在加載...”，僅此而已。 如果我右鍵單擊那個詞，我會得到菜單。

有什么建議么？

如果，當我將它指向 function customMenu 時，我添加() ，然后我會得到一個非常奇怪的菜單： -create -rename -delete -edit --cut --copy --paste --Add Group --刪除

我不確定我知道發生了什么事。 我將 function 名稱更改為不同的名稱，以確保我沒有得到 jQuery 或 jsTree function，但我仍然得到奇怪的行為。 有什么建議么？

Answer 1

建議不要自己處理上下文菜單的創建，而是讓 jstree 為您完成。

所以在初始化代碼中你會寫：

$("#demo1").jstree(
{ 
    "plugins" : [ "contextmenu" ]
}

這足以擁有一個功能性的上下文菜單。

Answer 2

不要將 select 方法綁定到 jstree。 而是按照下面的代碼創建新的菜單項。 這應該可以正常工作。

$("#demo1").jstree(
{ 
     "contextmenu":{
         items:{
              "LogicalNameForMenuItem":{
                     label: "DisplayNameForMenuItem",
                     action: function (node) {
                          <--Your code to handle the function goes here-->
                     } 
               }
          }
      },

      "plugins" : [ "contextmenu","crrm","ui" ]

});

這應該有效。

如果要刪除默認菜單項，請將它們設置為 false

"contextmenu":{
         items:{
            create:false,
            remove:false,
            ccp:false
         }
}