在新的jstree中，单击未使用复制的锚点触发的事件

Click event not firing with copied anchor in new jstree

本文关键字：事件 复制 单击 jstree 未使用      更新时间：2023-09-26

我有一个点击事件，它只允许锚标记在双击时工作。当锚点标记在原始树中时，这种情况很好，但在树中的文件复制到另一棵树后，事件不会触发，只需单击即可使锚点标记工作。有人知道原因吗？新树中的锚点标记完全相同。我的代码如下：

$('.tree-link').click(function(){
    return false;
}).dblclick(function() {
    window.location = this.href;
    return false;
});

复制前的原始锚点标记（激发事件）：

<a class="jstree-anchor  tree-link" href="#settings.html"><i class="jstree-icon jstree-themeicon fa fa-briefcase icon-state-success  jstree-themeicon-custom"></i>test</a>

新树中复制的锚点标签（不触发事件）：

<a class="jstree-anchor  tree-link" href="#settings.html"><i class="jstree-icon jstree-themeicon fa fa-briefcase icon-state-success  jstree-themeicon-custom"></i>test</a>

两个锚点标签完全相同，但我不知道为什么另一个没有触发点击事件。。。有人知道为什么吗？

您是否检查了this.href在函数范围内是否可以访问？很可能您引用的是jquery，而不是对象本身

尝试：

var self = this;
$('.myClass').click(function(){
    return false;
}).dblclick(function() {
    window.location = this.href;
    return false;
});

之所以会发生这种情况，是因为从一棵树移动到另一棵树可能会从DOM中删除节点并再次插入它。

看看这个：

$('.myClass').click(function() {
  return false;
}).dblclick(function() {
  window.location = this.href;
});
$('.move').click(function() {
  var anchor = $('.myClass');
  anchor.remove();
  document.body.appendChild(anchor.get(0));
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="http://example.com"/ class="myClass">link</a>
<button class="move">Move link</button>

这个问题的解决方案是使用jQuery的方法.on，它将事件附加到将来将添加到DOM的所有元素。

这样尝试：

$('body').on('click', '.tree-link', function(event){
        event.preventDefault();
        console.log('single-click');
}).on('dblclick', function() {
        event.preventDefault();
        console.log('double-click');
});

小提琴在这里：http://jsfiddle.net/vxm4quzz/1/

此外，您可能有兴趣阅读以下内容：jQuery eventDelegation

我放弃了使用锚点，只是在使用window.location.href更改页面时使用了双击事件。这目前对我来说很好。如果有人感兴趣，下面是代码：

$('#tree').on("dblclick", function (event) {
var li = $(event.target).closest("li");
var node = $('#tree').jstree().get_node(li.attr('id'));
if(node.icon.indexOf("briefcase") != -1){
    window.location.href = "#settings.html";
}
相关文章：