单击按钮时，按jstree中的ID删除节点

我正在使用jstree并且我想通过点击按钮后按ID删除特定节点。单击按钮时，按jstree中的ID删除节点

这是我在HTML列表格式树：

<div id="testtree"> 
    <ul> 
     <li id="1" title="ID:1"><a>Fruits and Vegetables</a> 
      <ul> 
     <li id="11" title="ID:11"><a>Fruit</a> 
       <ul> 
       <li id="111" title="ID:111"><a>Apple</a></li> 
       <li id="112" title="ID:112"><a>Banana</a></li> 
       </ul> 
      </li> 
      </ul> 
     </li> 
    </ul> 
</div>

，这是我的按钮事件（我有几个按钮，因此阵列）：

buttons[0].addEventListener("click", function(ev) { 
     $("#testtree").jstree("remove", $("111")); 
    });

任何想法我错过了？

更新：

我已经纠正错字，但它仍然无法正常工作。这是完整的代码，也许错误是在别的地方？

<html> 
<head> 
    <title>jstree test</title> 
</head> 
<body> 
    <div id="testtree"> 
     <ul> 
      <li id="1" title="ID:1"><a>Fruits and Vegetables</a> 
       <ul> 
        <li id="11" title="ID:11"><a>Fruit</a> 
         <ul> 
          <li id="111" title="ID:111"><a>Apple</a></li> 
          <li id="112" title="ID:112"><a>Banana</a></li> 
          </ul> 
        </li> 
       </ul> 
      </li> 
     </ul> 
    </div> 

    <button>Remove Apple</button> 
    <script type="text/javascript" src="_lib/jquery.js"></script> 
    <script type="text/javascript" src="jquery.jstree.js"></script> 
    <script> 

     $(document).ready(function() { 

      $("#testtree").jstree({ 
       "plugins" : [ "themes", "html_data", "checkbox", "ui" ], 
       "core": { "initially_open": ["1"]} 
      }); 
     }); 

     var buttons = document.querySelectorAll("button"); 

     buttons[0].addEventListener("click", function(ev) { 
      $("#testtree").jstree("remove","#111"); 
     }); 

    </script> 
</body> 
</html>

来源

2013-08-22 atreju

在jQuery中，你可以写：'$（ “＃testtree＃111”），删除（）;' –

这样的作品，但我需要能够稍后重新加载树没有缺失节点。 – atreju

根据jsTree documentation删除这样

$("#testtree").jstree("remove","#111");

没有$()

$("#testtree").jstree({ 
     "plugins": ["themes", "html_data", "checkbox", "ui", "crrm"], 
     "core": { 
      "initially_open": ["1"] 
     } 
    });

您需要将“crrm”添加到插件

来源

2013-08-22 09:19:55 Anton

我试过这个，但它仍然不起作用。我已经在第一篇文章中更新了完整的代码，也许错误在别的地方？ – atreju

好的，在我的电脑上进行测试 – Anton

@ user2241303找到了！ :)我会更新我的答案 – Anton

-1

我觉得有一个错字：尝试：

$("#testtree").jstree("remove", $("#111"));

来源

2013-08-22 09:17:14

任何答案都适用于我。我倾向于使用它：

$.jstree._reference("#tree-container or node or jquery selector").delete_node(node);

希望它可以帮助某人。

来源

2013-12-13 14:24:32 agapitocandemor

加上一个这是我为我做的感谢。不需要额外的插件。 – Gurnard

jsTree的manual（版本3.0.0）说：

请记住，默认情况下，所有修改的树是防止（创建，重命名，移动，删除）。启用它们 core.check_callback为true

您还可以使用函数来指定要允许的修改类型。例如，只允许删除节点：

$('#tree').jstree({ 
    'core' : { 
     'check_callback' : function (operation, node, node_parent, node_position, more) { 
      // operation can be 'create_node', 'rename_node', 'delete_node', 'move_node' or 'copy_node' 
      // in case of 'rename_node' node_position is filled with the new node name 
      return operation === 'delete_node'; 
     } 
    } 
});

来源

2014-03-31 13:03:50 eagor

这对我很有帮助。

我有超过70000个叶节点&这个瞬间删除。

this.getFilterTree().jstree("destroy"); 
this.getFilterTree().html(""); 


//return tree holder div 
getFilterTree: function() { 
return $('#jstreeHolder'); 
}

删除后，您可以再次实例化树！

来源

2014-04-12 14:43:08

这对我而言没有任何外部插件。

$('#treeid').jstree().delete_node([node.id]); 
 
$('#treeid').jstree("refresh");

来源

2018-01-17 10:19:07 Khateeb321

单击按钮时，按jstree中的ID删除节点

回答

相关问题