preventDefault(） 不会阻止该操作

preventDefault() doesn't prevent the action

本文关键字：操作 preventDefault      更新时间：2023-09-26

当我在链接上使用event.preventDefault()时，它可以工作，但是当我在按钮上使用它时则不起作用！

演示

我的代码：

<a id="link" href="http://www.google.com">link</a>
<button id="button" onclick="alert('an alert')">button</button>​
$('#link').click(function(event){
  event.preventDefault();
});
$('#button').click(function(event){
  event.preventDefault();
});

链接操作被取消，但当我单击按钮时，仍然执行onClick操作。

有什么帮助吗？ 我想做的是在不更改按钮 html 的情况下阻止按钮onClick操作(我知道该怎么做

$('#button').removeAttr('onclick');

>您希望event.stopImmediatePropagation();一个元素上是否有多个事件处理程序，并且您希望阻止其他事件处理程序执行。 preventDefault()只是阻止默认操作(例如提交表单或导航到另一个 URL(，而stopImmediatePropagation()阻止事件在 DOM 树中冒泡，并防止执行同一元素上的任何其他事件处理程序。

以下是一些有用的链接，解释了各种方法：

  • http://api.jquery.com/event.preventDefault/
  • http://api.jquery.com/event.stopPropagation/
  • http://api.jquery.com/event.stopImmediatePropagation/

但是，由于它仍然不起作用，这意味着onclick=""处理程序在附加的事件处理程序之前执行。您无能为力，因为当您的代码运行时，onclick代码已经执行。

最简单的解决方案是完全删除该处理程序：

$('#button').removeAttr('onclick');

即使通过带有useCapture=true的纯javascript(addEventListener()(添加事件侦听器也无济于事 - 显然内联事件甚至在事件开始下降DOM树之前就触发了。

如果您只是因为需要而不想删除处理程序，只需将其转换为正确附加的事件：

var onclickFunc = new Function($('#button').attr('onclick'));
$('#button').click(function(event){
    if(confirm('prevent onclick event?')) {
        event.stopImmediatePropagation();   
    }
}).click(onclickFunc).removeAttr('onclick');

你需要stopImmediatePropagation而不是preventDefault。 preventDefault 可防止默认浏览器行为，而不是方法冒泡。

http://api.jquery.com/event.stopImmediatePropagation/

http://api.jquery.com/event.preventDefault/

preventDefault 函数不会阻止触发事件处理程序，而是停止发生默认操作。对于链接，它会停止导航，对于按钮，它会停止提交表单等。

您正在寻找的是 stopImmediatePropagation .

你可以试试这个：

$('#button').show(function() {
  var clickEvent = new Function($(this).attr('click')); // store it for future use
  this.onclick = undefined;
});

演示

它

帮助了我

function goToAccessoriesPage(targert) {
       targert.onclick.arguments[0].preventDefault();
       ...
}
相关文章：