动态元素：如何防止其他jquery处理程序运行

问题描述：

我正在尝试处理动态创建的元素的点击事件（因此无法使用.click jQuery调用），但同时我不想默认行动发生。基本上我想显示我的自定义用户界面，而不是默认的用户界面。动态元素：如何防止其他jquery处理程序运行

jQuery(document).on('click', selector, function(e) { 
    console.log('I got the event, let me try to stop other handlers ..'); 

    // none of these work 
    e.preventDefault(); 
    e.stopImmediatePropagation(); 
    e.stopPropagation(); 

    // want show my UI here ... 

    return false; 
});

也试过mousedown事件。

但它不起作用，默认UI仍显示出来。

注：我不控制默认处理程序，不能改变这一点。

让我们试着做出更长远的解决方案。你如何生成动态元素？ 012fa Afaik，当你调用document.createElement时，它返回一个DOM节点，你可以包装jQuery函数。请回复，以便我可以尝试回答这个问题。 – Jekk

@Jekk元素本身是在WordPress内核中生成的，深入一些Backbone.js内部，我相信。基本不知道。 – srvy

答

可以使用off请从选择的单击事件：

在这里你去工作片断：

$("#test").html('<button class="click">Click me to fire event</button><button class="clicktocancel">Click me to remove event</button>'); 
 

 
$("#test").on("click", ".click", function() { 
 
    console.log("clicked") 
 
}) 
 

 
$("#test").on("click", ".clicktocancel", function() { 
 
    console.log("click cancelled") 
 
    $("#test").off("click", ".click") 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="test"> 
 
</div>

似乎没有帮助我的情况。我添加了这个，并把一个控制台日志里面的处理程序，但没有显示出来.. jQuery（document）.off（'mousedown'，'.dashicons-edit'，function（e）{关闭mousedown handlers ...'）; }）; – srvy

@srvy：我用一个工作片段更新了我的答案，看看你确定完成了同样的工作 –

答

问题是，事件中首先执行先得基础。这意味着如果其他click事件绑定在您的事件之前，那么它首先在链中执行。要解决此问题，您可以使用off()删除绑定到该元素的所有单击事件，然后添加事件处理程序。

所以写这行代码的脚本之前

jQuery(document).off('click', selector);

注：off()仅删除使用on()

答

注意连接的事件：以下主要适用于jQuery的事件处理程序。通常不可能操纵未跟踪的事件处理程序分配，例如通过.addEventListener()添加的事件处理程序分配。

您需要确保您的事件处理程序是jQuery将事件传递给的第一个事件处理程序。 jQuery不支持这种操作，所以需要一些黑客行为。

This answer和它的意见之一指出，如何访问与元素相关的jQuery的事件处理程序的列表：

$._data($('#someElementId')[0]).events

这个，你可以安排你的处理器是第一位的。

This answer展示了如何防止这种情况的处理程序后，处理器从执行：

$('#someElementId').on('click', function(event){ 
    // do not pass this event to further jQuery event handlers 
    event.stopImmediatePropagation(); 
    // ... 
});

总之，这些技术可用于确保您的事件处理程序触发，然后再利用，为防止进一步的处理程序从触发同事件。

动态元素：如何防止其他jquery处理程序运行

相关推荐