blocks|key|3023031|text|事实证明我可以做到这一点：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3023032|jstree.bind("dblclick.jstree",+function+(event)+{
+++var+node+=+$(event.target).closest("li");
+++var+data+=+node.data("jstree");
+++//+Do+my+action
});|code-block|syntax|javascript|3023033|node包含被单击的li，data包含包含我的信息的元数据。|offset|length|style|CODE|3023034|entityMap^0|0|0|0|4|A|2|D|4|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|P|8|@]|9|@]|A|$E|F]]|$1|G|3|H|5|6|7|Q|8|@$I|R|J|S|K|L]|$I|T|J|U|K|L]|$I|V|J|W|K|L]]|9|@]|A|$]]|$1|M|3|-4|5|6|7|X|8|@]|9|@]|A|$]]]|N|$]]

It turns out I can do this:

<pre><code>jstree.bind("dblclick.jstree", function (event) {
 var node = $(event.target).closest("li");
 var data = node.data("jstree");
 // Do my action
});
</code></pre>

<code>node</code> contains the <code>li</code> that was clicked and <code>data</code> contains the metadata with my info in it.

blocks|key|3023047|text|'dblclick.jstree‘在最新版本的jsTree+1.0中不存在。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3023048|节点的DoubleClick：|3023049|$("#yourtree").delegate("a","dblclick",+function(e)+{
++var+idn+=+$(this).parent().attr("id").split("_")[1];
++alert(idn);+//return+NodeID++++
});|code-block|syntax|javascript|3023050|如果您只想要dblclicked节点，请插入此内容|3023051|if+(this.className.indexOf('icon')+==+-1)+{++/*+is+the+node+clicked+a+leaf?+*/+}|3023052|entityMap^0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|O|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|P|8|@]|9|@]|A|$]]|$1|D|3|E|5|F|7|Q|8|@]|9|@]|A|$G|H]]|$1|I|3|J|5|6|7|R|8|@]|9|@]|A|$]]|$1|K|3|L|5|F|7|S|8|@]|9|@]|A|$G|H]]|$1|M|3|-4|5|6|7|T|8|@]|9|@]|A|$]]]|N|$]]

'dblclick.jstree' doesn't exist in last version jsTree 1.0.

DoubleClick for node:

<pre><code>$("#yourtree").delegate("a","dblclick", function(e) {
 var idn = $(this).parent().attr("id").split("_")[1];
 alert(idn); //return NodeID 
});
</code></pre>

Insert this if you want just dblclicked node

<pre><code>if (this.className.indexOf('icon') == -1) { /* is the node clicked a leaf? */ }
</code></pre>

blocks|key|300005|text|为我获取数据有点不同，但除此之外，GiddyUpHorsey的答案是正确的。下面是代码：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|300006|++++++++jstree.bind("dblclick.jstree",+function+(e,+data)+{
++++++++++++var+node+=+$(e.target).closest("li");
++++++++++++var+id+=+node[0].id;+//id+of+the+selected+node
++++++++});|code-block|syntax|javascript|300007|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

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:

<pre><code> jstree.bind("dblclick.jstree", function (e, data) {
 var node = $(e.target).closest("li");
 var id = node[0].id; //id of the selected node
 });
</code></pre>

blocks|key|3023154|text|以上答案不适用于最新版本的jstree+(+3.3.4)|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3023155|这花费了我一天的心思工作，但我最终得到了它。下面是双击编辑代码的工作原理：|3023156|​|3023157|$('#tree1').bind("dblclick.jstree",+function+(event)+{
++var+tree+=+$(this).jstree();
++var+node+=+tree.get_node(event.target);
++tree.edit(node);
});|code-block|syntax|javascript|3023158|3023159|这是一个有效的jsfiddle。|offset|length|3023160|entityMap|0|LINK|mutability|MUTABLE|url|https://jsfiddle.net/doug99collins/rpkbpxsk/3/^0|0|0|0|0|0|7|8|0|0^^$0|@$1|2|3|4|5|6|7|X|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Y|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|Z|8|@]|9|@]|A|$]]|$1|F|3|G|5|H|7|10|8|@]|9|@]|A|$I|J]]|$1|K|3|E|5|6|7|11|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|12|8|@]|9|@$N|13|O|14|1|15]]|A|$]]|$1|P|3|-4|5|6|7|16|8|@]|9|@]|A|$]]]|Q|$R|$5|S|T|U|A|$V|W]]]]

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:

<div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>$('#tree1').bind("dblclick.jstree", function (event) {
 var tree = $(this).jstree();
 var node = tree.get_node(event.target);
 tree.edit(node);
});</code></pre>
</div>
</div>


and here is a working <a href="https://jsfiddle.net/doug99collins/rpkbpxsk/3/" rel="nofollow noreferrer">jsfiddle</a>.

blocks|key|3237500|text|作为3.3.5版本，我使用的是这个版本：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3237501|++++++++$('#jstree').on("dblclick.jstree",+function+(e)+{
++++++++++++var+instance+=+$.jstree.reference(this),
++++++++++++node+=+instance.get_node(e.target);
++++++++++++//+Code
++++++++});|code-block|syntax|javascript|3237502|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

as version 3.3.5, I'm using this one:

<pre><code> $('#jstree').on("dblclick.jstree", function (e) {
 var instance = $.jstree.reference(this),
 node = instance.get_node(e.target);
 // Code
 });
</code></pre>

blocks|key|3023183|text|这对我很管用|type|unstyled|depth|inlineStyleRanges|entityRanges|data|3023184|$("#MyTree").on('dblclick','.jstree-anchor',+function+(e)+{
++++var+instance+=+$.jstree.reference(this),
++++node+=+instance.get_node(this);
++++console.log(node);
});|code-block|syntax|javascript|3023185|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|I|8|@]|9|@]|A|$]]|$1|B|3|C|5|D|7|J|8|@]|9|@]|A|$E|F]]|$1|G|3|-4|5|6|7|K|8|@]|9|@]|A|$]]]|H|$]]

It worked for me

<pre><code>$("#MyTree").on('dblclick','.jstree-anchor', function (e) {
 var instance = $.jstree.reference(this),
 node = instance.get_node(this);
 console.log(node);
});
</code></pre>

I'm using the jsTree jQuery plugin and want to execute code when the user double clicks a node.

I can't seem to get it to work. I found some documentation on a <code>ondblclk</code> event but it doesn't fire.

<pre><code> browser.jstree(
 {
 plugins: ["themes", "json_data", "ui", "cookies"],
 callback:
 {
 ondblclk: function (node, tree) {
 if (!thisReportBrowserthis._isFoldersOnly) {
 var f = node;
 }
 }
 }
 }
 );
</code></pre>

How can I handle double click events with jstree?

How can I attach custom behaviour to a double click in jsTree?

jQuery

我正在使用jsTree jQuery插件，并希望在用户双击节点时执行代码。我好像不能让它工作。我找到了一些关于ondblclk事件的文档，但它不会触发。    browser.jstree(            {                plugins: ["themes", "json_data", "ui...

问如何在jsTree中将自定义行为附加到双击？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jsTree中将自定义行为附加到双击？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何在jsTree中将自定义行为附加到双击？
EN