清除javascript中的preventDefault和stopPropagation。

时间:2020-12-28 15:44:22

Hi i need to prevent the default action when the user clicked on a element and prevent its default action only for that time and need to do some other action. For which i used

Hi,我需要防止当用户点击一个元素并阻止它的默认动作时,只在那个时候,需要做一些其他的动作。我使用

document.body.onclick = function (e) {
    e.preventDefault();
    e.stopPropagation();
}

But now the problem is, after i performing the above action i need to remove the preventDefault and stopPropagation, because none of the link(a href) is getting triggered after this. So how to undo this after performing it? Please note that it is a pure JavaScript code and im not using any library like jquery. So i can't use .bind and .unbind. Any idea on this would be greatly appreciated.

但是现在的问题是,在执行上述操作之后,我需要删除preventDefault和stopPropagation,因为在此之后没有一个链接(href)被触发。那么如何在执行后撤销它呢?请注意,这是一个纯JavaScript代码,我不使用任何像jquery这样的库。所以我不能使用。bind和。unbind。任何关于这方面的想法都将不胜感激。

3 个解决方案

#1


1  

You can replicate the behavior of bind and unbind using addEventListener and removeEventListener

您可以使用addEventListener和removeEventListener复制bind和unbind的行为。

function stopIt(e) {
  e.preventDefault();
  e.stopPropagation();
}

document.body.addEventListener("click", stopIt);

// then later

document.body.removeEventListener("click", stopIt);

Note: IE <= 8 doesn't support addEventListener and removeEventListener, so you'll need to use attachEvent as mentioned here - https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#Compatibility

注意:IE <= 8不支持addEventListener和removeEventListener,因此您需要使用这里提到的attachEvent—https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#兼容性。

#2


1  

Don't bind the event to the body, bind the event to the element you need to prevent:

不要将事件绑定到正文,将事件绑定到需要防止的元素:

document.getElementById('theTarget').onclick = function(e) {
    // ...
}

#3


1  

If I understand your requirement correctly, I'm afraid you cannot undo the e.preventDefault(); . But by default, the handler function will be executed before performing the default action. So in your case, you just don't need the e.preventDefault(); at all. And remember to attach the event listeners only to <a> tags

如果我正确地理解了您的要求,恐怕您无法撤销。preventdefault ();。但是默认情况下,处理函数将在执行默认操作之前执行。在你的例子中,你不需要e。preventdefault ();在所有。并且记住只将事件监听器附加到标记。

var aTags = document.getElementsByTagName("a");

for (var i=0;i<aTags.length;i++){
    aTags[i].onclick = function (e) {
       // just perform your action here, don't need e.preventDefault();
    }
}

#1


1  

You can replicate the behavior of bind and unbind using addEventListener and removeEventListener

您可以使用addEventListener和removeEventListener复制bind和unbind的行为。

function stopIt(e) {
  e.preventDefault();
  e.stopPropagation();
}

document.body.addEventListener("click", stopIt);

// then later

document.body.removeEventListener("click", stopIt);

Note: IE <= 8 doesn't support addEventListener and removeEventListener, so you'll need to use attachEvent as mentioned here - https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#Compatibility

注意:IE <= 8不支持addEventListener和removeEventListener,因此您需要使用这里提到的attachEvent—https://developer.mozilla.org/en-US/docs/Web/API/EventTarget.addEventListener#兼容性。

#2


1  

Don't bind the event to the body, bind the event to the element you need to prevent:

不要将事件绑定到正文,将事件绑定到需要防止的元素:

document.getElementById('theTarget').onclick = function(e) {
    // ...
}

#3


1  

If I understand your requirement correctly, I'm afraid you cannot undo the e.preventDefault(); . But by default, the handler function will be executed before performing the default action. So in your case, you just don't need the e.preventDefault(); at all. And remember to attach the event listeners only to <a> tags

如果我正确地理解了您的要求,恐怕您无法撤销。preventdefault ();。但是默认情况下,处理函数将在执行默认操作之前执行。在你的例子中,你不需要e。preventdefault ();在所有。并且记住只将事件监听器附加到标记。

var aTags = document.getElementsByTagName("a");

for (var i=0;i<aTags.length;i++){
    aTags[i].onclick = function (e) {
       // just perform your action here, don't need e.preventDefault();
    }
}