jQuery 如何将自定义行为附加到 jsTree 中的双击?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/3674625/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How can I attach custom behaviour to a double click in jsTree?
提问by GiddyUpHorsey
I'm using the jsTree jQuery plugin and want to execute code when the user double clicks a node.
我正在使用 jsTree jQuery 插件并希望在用户双击节点时执行代码。
I can't seem to get it to work. I found some documentation on a ondblclk
event but it doesn't fire.
我似乎无法让它工作。我找到了一些关于ondblclk
事件的文档,但它没有触发。
browser.jstree(
{
plugins: ["themes", "json_data", "ui", "cookies"],
callback:
{
ondblclk: function (node, tree) {
if (!thisReportBrowserthis._isFoldersOnly) {
var f = node;
}
}
}
}
);
How can I handle double click events with jstree?
如何使用jstree处理双击事件?
回答by GiddyUpHorsey
It turns out I can do this:
事实证明我可以这样做:
jstree.bind("dblclick.jstree", function (event) {
var node = $(event.target).closest("li");
var data = node.data("jstree");
// Do my action
});
node
contains the li
that was clicked and data
contains the metadata with my info in it.
node
包含li
被点击的和data
包含我的信息的元数据。
回答by bizauto
'dblclick.jstree' doesn't exist in last version jsTree 1.0.
'dblclick.jstree' 在最新版本的 jsTree 1.0 中不存在。
DoubleClick for node:
双击节点:
$("#yourtree").delegate("a","dblclick", function(e) {
var idn = $(this).parent().attr("id").split("_")[1];
alert(idn); //return NodeID
});
Insert this if you want just dblclicked node
如果您只想要 dblclicked 节点,请插入此项
if (this.className.indexOf('icon') == -1) { /* is the node clicked a leaf? */ }
回答by Quynh
It's a bit different to get the data out for me, but otherwise GiddyUpHorsey's answer was spot-on. Here is the code again:
为我获取数据有点不同,但否则 GiddyUpHorsey 的回答是准确的。这里又是代码:
jstree.bind("dblclick.jstree", function (e, data) {
var node = $(e.target).closest("li");
var id = node[0].id; //id of the selected node
});
回答by user1254723
The above answers do not work on the latest version of jstree (which is 3.3.4)
This cost me a day of mind bending work but I finally got it.
Here is working doubleclick to Edit code:
以上答案不适用于最新版本的 jstree(即 3.3.4)
这让我费了一天的心思,但我终于明白了。这是工作双击编辑代码:
$('#tree1').bind("dblclick.jstree", function (event) {
var tree = $(this).jstree();
var node = tree.get_node(event.target);
tree.edit(node);
});
and here is a working jsfiddle.
这是一个有效的jsfiddle。
回答by Y. ?zdemir
as version 3.3.5, I'm using this one:
作为 3.3.5 版,我正在使用这个:
$('#jstree').on("dblclick.jstree", function (e) {
var instance = $.jstree.reference(this),
node = instance.get_node(e.target);
// Code
});
回答by MaxEcho
It worked for me
它对我有用
$("#MyTree").on('dblclick','.jstree-anchor', function (e) {
var instance = $.jstree.reference(this),
node = instance.get_node(this);
console.log(node);
});