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

когда я использую событие.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
Любой помочь? то, что я хочу сделать, это предотвратить действие кнопки onClick без изменения кнопки html (Я знаю, как это сделать

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

14
javascript javascript-events jquery

4 ответов

вы хотите 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');
25

вам нужно stopImmediatePropagation не preventDefault. preventDefault предотвращает поведение браузера по умолчанию, а не пузырьковый метод.

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

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

4

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

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

2

вы можете попробовать это:

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

демо

2