17

当我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');

4

5 回答 5

32

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

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

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

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

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

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

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

var onclickFunc = new Function($('#button').attr('onclick'));
$('#button').click(function(event){
    if(confirm('prevent onclick event?')) {
        event.stopImmediatePropagation();   
    }
}).click(onclickFunc).removeAttr('onclick');
于 2012-05-03T13:26:13.427 回答
4

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

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

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

于 2012-05-03T13:26:31.380 回答
3

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

您正在寻找的是stopImmediatePropagation.

于 2012-05-03T13:27:14.500 回答
2

你可以试试这个：

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

演示

于 2012-05-03T13:26:22.847 回答
0

它帮助了我

function goToAccessoriesPage(targert) {
       targert.onclick.arguments[0].preventDefault();
       ...
}
于 2021-03-19T09:34:26.610 回答