PreventDefault() не работает

Когда я использую event.preventDefault() по ссылке, он работает, однако, когда я использую его на кнопке, нет!
DEMO
мой код:

<a id="link" href="#" onclick="location.href='http://www.google.com'; return false;">link</a>
<button id="button" onclick="alert('an alert')">button</button>​

$('#link').click(function(event){
  event.preventDefault();
});
$('#button').click(function(event){
  event.preventDefault();
});

Действие ссылки отменяется, но когда я нажимаю кнопку, все равно выполняется действие onClick
Любая помощь? что я хочу сделать, это предотвратить кнопку onClick action без изменения кнопки html (я знаю, как это сделать

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

Ответы

Ответ 1

Вы хотите event.stopImmediatePropagation();, если на элементе есть несколько обработчиков событий, и вы хотите запретить другим выполнять. preventDefault() просто блокирует действие по умолчанию (например, отправляет форму или перемещается по другому URL-адресу), а stopImmediatePropagation() предотвращает появление пузырьков в дереве DOM и предотвращает выполнение любых других обработчиков событий в одном элементе.

Вот несколько полезных ссылок, объясняющих различные методы:

Однако, поскольку он все еще не работает, это означает, что обработчик onclick="" выполняется перед присоединенным обработчиком событий. С тех пор, когда ваш код запускает код onclick, вы ничего не сможете сделать.

Самое простое решение - полностью удалить этот обработчик:

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

Даже добавление прослушивателя событий через простой javascript (addEventListener()) с помощью 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');

Ответ 3

вы можете попробовать следующее:

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

DEMO

Ответ 4

Функция preventDefault не останавливает запуск обработчиков событий, а останавливает действие по умолчанию. Для ссылок он останавливает навигацию, кнопки, останавливает отправку формы и т.д.

То, что вы ищете, это stopImmediatePropagation.