我正在使用jstree库。一个非常好的图书馆,但是我遇到了一个问题。上下文菜单的回调不起作用。
我做了一个小的工作示例-当您添加/删除/重命名节点时,它应该发出警报,但是什么也没有发生。
有谁知道为什么不这样做,解决方案是什么?
您可以在线查看无法正常工作的示例:http : //www.leermetstrips.nl/Content/tree.htm
或在这里:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>JS tree example</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="http://code.jquery.com/jquery-1.8.0.js"></script>
<script src="http://cachedcommons.org/cache/jquery-jstree/1.0.0/javascripts/jquery-jstree.js" type="text/javascript"> </script>
<script type="text/javascript">
$().ready( function() {
var data = [{"data":"Root node","children":[{"data":"node one","children":[],"metadata":[{"action":"action12"}]}],"metadata":[{"action":"action11"}]}];
$('#tree').jstree(
{
json_data: { data: data },
plugins: ["themes", "json_data", "ui", "contextmenu", "crrm"],
// TODO: this does not work, why?
callback: {
oncreate: function (NODE, REF_NODE, TYPE, TREE_OBJ, RB) {
alert('oncreate');
},
onrename: function (NODE, LANG, TREE_OBJ, RB) {
alert('onrename');
},
ondelete: function (NODE, TREE_OBJ, RB) {
alert('ondelete');
}
}
}
);
});
</script>
</head>
<body>
<h3>JS tree example</h3>
<p>When adding, or deleting new nodes, there should be an alert. But there is none. Why?</p>
<div id="tree" style="border:1px solid;"></div>
<p>Click on the tree with your right mouse button to add, rename or delete NEW tree nodes.</p>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
callbackjstree核心功能没有属性。因此,删除此:
callback: {
oncreate: function (NODE, REF_NODE, TYPE, TREE_OBJ, RB) {
alert('oncreate');
},
onrename: function (NODE, LANG, TREE_OBJ, RB) {
alert('onrename');
},
ondelete: function (NODE, TREE_OBJ, RB) {
alert('ondelete');
}
}
Run Code Online (Sandbox Code Playgroud)
您需要通过以下方式将jstree事件绑定到jstree对象之外:
$('#tree').bind('create.jstree',function (node, ref) {
alert('oncreate');
});
$('#tree').bind('rename.jstree',function (node, ref) {
alert('onrename');
});
$('#tree').bind('remove.jstree',function (node, ref) {
alert('ondelete');
});
Run Code Online (Sandbox Code Playgroud)