2

これは一見トリッキーな 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();
});

リンク自体をクリックすると、次のことがわかります。

  1. onclick HTML 属性が発動しました!
  2. jQueryのクリックが発射されました！
  3. （スパンクリック、他のイベントが発生するのを見てみましょう...）
  4. onclick HTML 属性が発動しました!
  5. jQueryのクリックが発射されました！
  6. hrefが続きます

イベントがスパンまでバブリングするため、余分な時間で JS イベントをループします。これは少し間抜けでエレガントではありませんが、完全に予想されており、私には理にかなっています。ここで重要な点は、すべての JS イベントが終了した後、href がフォローされることです。

外側のスパンをクリックすると、イベントの順序は次のようになります。

  1. （スパンクリック、他のイベントが発生するのを見てみましょう...）
  2. jQueryのクリックが発射されました！
  3. onclick HTML 属性が発動しました!
  4. ... {コオロギ!?!} ....

アンカーの JSclickイベントが発生しても、href はフォローされません。

からバブルアップした後、2回目まで.one()クリックイベントのバインドを解除しないと思います。その時点で、イベントの伝播は完全に停止します。href はすべてのクリック イベントが終了するまで追跡されないため、信号が で終了すると、hrefへのイベントの発生を認識しません。span anchorspananchor

……でも、本当にそうなの？何を与える？

window.locationこの問題にアプローチするより良い方法は何ですか (さまざまな理由で、JS が href を引き抜いて手動で設定するのを避けたいと思います)。

4

1 に答える 1

4

最初のインスタンス (直接クリックしたとき) でリンクがたどられます。これは、<a>タグが機能する方法であり、どのハンドラーもデフォルトの動作をキャンセルするよう要求しないためです。

タグで jQuery を介して明示的に「クリック」をトリガーして<a>も、リンクはたどりません。それが jQuery のしくみです。

于 2012-04-05T15:25:10.880 に答える