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

プレーンな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');
于 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 に答える