jsTree右键菜单问题

Question

这应该是一个非常简单的问题，但我似乎找不到答案。我最近（就像今天）开始使用jsTree，我刚刚设置了我的第一个树形结构。我创建了一个无序列表，其中只包含静态文本：

<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是一个简单的函数，它返回一个对象。

当我执行第一段代码时，我得到了我的jsTree，并且它会折叠和展开。当我执行第二段代码时，jsTree所在的区域显示“正在加载...”，仅此而已。如果我右键点击那个词，我确实会得到菜单。

有什么建议吗？

如果我将其指向函数customMenu时添加()，那么我会得到一个非常奇怪的菜单，其中包括： -创建 -重命名 -删除 -编辑 --剪切 --复制 --粘贴 --添加组 --删除

我不确定发生了什么。我将函数名称更改为不同的名称，以确保我没有获得jQuery或jsTree函数，但我仍然获得奇怪的行为。有什么建议吗？

- Brian Beech

---

尝试在此处 :)https://dev59.com/wm455IYBdhLWcg3wD_2Z#11067303 - Jean G.T

Answer 1

建议不要自己处理右键菜单的创建，而是让jstree为您完成。

因此，在初始化代码中，您应该写：

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

这样就足以拥有一个功能完善的上下文菜单。

- Nir O.

Answer 2

不要将on 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
         }
}

- Teja