javascript - Rails 4 - jstree，如何禁用文件夹的 'delete' 操作？

Question

在 Rails 4.2.2 中，我使用带有上下文菜单选项的 jstree 插件。现在，文件和文件夹的所有上下文菜单选项均显示。如何禁用根文件夹和其他特定文件夹的“删除”选项？

脚本是，

<script type="text/javascript">
(function() {
var $j = jQuery.noConflict();

$j(document).ready(function() {

  $j("#jstree").jstree({
    "plugins": ["themes", "contextmenu", "dnd"],
    "core" : {
      themes: {"stripes": true},
      check_callback : true,
      animation : 0,
      data : {
        url: '/users/files/treedata.json'
      }
    },
    contextmenu : {
      "items" : function (node) {
        return {
          "view" : {
            label: "View",
            action: function(obj) {
              window.open("/users/files/view/" + node.id);
            }
          },
          "rename" : {
            label: "Rename",
            action: function(obj) {
              $j("#jstree").jstree(true).edit(node)
            }
          },
          "create" : {
            label: "Create New",
            action: function() {
              createNode(node);
            }
          },
          "delete" : {
            label: "Delete",
            action: function() {
              if ( confirm("Really delete " + node.text + "?") ) {
                deleteNode(node);
              }
            },
            separator_before: true
          }
        }
      }
    }
  });

  $j("#jstree").on("move_node.jstree", function(event, data) {
    moveNode(data);
  });

  $j("#jstree").on("rename_node.jstree", function(event, data) {
    renameNode(data);
  });

  $j("#jstree").on("select_node.jstree", function(event, data) {
    displayPath(data.node.id);
  });
});

function moveNode(data) {
  jQuery.ajax({
    type: "GET",
    url: "/users/home/move_node",
    data: {id: data.node.id, parent: data.parent, old_parent: data.old_parent},
    dataType : "script"
  });
}

function renameNode(data) {
  jQuery.ajax({
    type: "GET",
    url: "/users/home/rename_node",
    data: {name: data.text, id: data.node.id, parent: data.node.parent},
    dataType : "script"
  });
}

function createNode(parent) {
  jQuery.ajax({
    type: "GET",
    url: "/users/home/create_node",
    data: {name: "New Folder", parent: parent.id},
    dataType : "script"
  });
}

function deleteNode(node) {
  jQuery.ajax({
    type: "GET",
    url: "/users/home/delete_node",
    data: {id: node.id, parent: node.parent},
    dataType : "script"
  });
}

  function getPath(id) {
   if (id == "#") {
     return "";
    }
    return $j("#jstree").jstree(true).get_path({id: id}, "/");
  }

  function displayPath(nodeId) {
    $j("#path").text("Path: /" + getPath(nodeId));
  }

 })();
</script>

请帮助我完成 jstree 的禁用选项。同样在这里，“select_node.jstree”选项不起作用，我该如何解决这个问题？

Answer 1

如果 node 参数符合您的条件，则在您的 contextmenu.items 函数中返回 false:

items : function (node) {
    if (node.parents.length < 2) {
        return false;
    }

这只是一个演示 - 检查 node 看看你还能做什么。