これは一見トリッキーな HTML/JS で、私または jQuery のいずれかがループをスローします (私のお金は私にあります)。
この fiddleでデモされています。
...しかし、ここにシナリオがあります。アンカーはスパンでラップされます:
<span> the span
<a onclick="alert('onclick HTML attritbute fired!')" href="http://www.href-attribute- fired.com">the link</a>
wraps the link
</span>
スパンには、アンカーをクリックするクリック ハンドラーがあります。.one()これは、イベントのバブリングのために永遠にループするのを避けるために必要です (私も試し.on()てみ.off()ましたが、同じ結果でループを短絡させました - フィドルを参照してください)。
$('a').click(function() {
alert("jQuery click fired!");
});
$('span').one("click", function() {
alert('(span clicked, let us see what other events fire...)');
$(this).find('a').click();
});
リンク自体をクリックすると、次のことがわかります。
- onclick HTML 属性が発動しました!
- jQueryのクリックが発射されました！
- （スパンクリック、他のイベントが発生するのを見てみましょう...）
- onclick HTML 属性が発動しました!
- jQueryのクリックが発射されました！
- hrefが続きます
イベントがスパンまでバブリングするため、余分な時間で JS イベントをループします。これは少し間抜けでエレガントではありませんが、完全に予想されており、私には理にかなっています。ここで重要な点は、すべての JS イベントが終了した後、href がフォローされることです。
外側のスパンをクリックすると、イベントの順序は次のようになります。
- （スパンクリック、他のイベントが発生するのを見てみましょう...）
- jQueryのクリックが発射されました！
- onclick HTML 属性が発動しました!
- ... {コオロギ!?!} ....
アンカーの JSclickイベントが発生しても、href はフォローされません。
からバブルアップした後、2回目まで.one()クリックイベントのバインドを解除しないと思います。その時点で、イベントの伝播は完全に停止します。href はすべてのクリック イベントが終了するまで追跡されないため、信号が で終了すると、hrefへのイベントの発生を認識しません。span anchorspananchor
……でも、本当にそうなの？何を与える？
window.locationこの問題にアプローチするより良い方法は何ですか (さまざまな理由で、JS が href を引き抜いて手動で設定するのを避けたいと思います)。