5

内部に<label>with a要素があります。要素のデフォルトの動作 (つまり、移動)<a href="#">を防止したいのですが、要素のデフォルトの動作(つまり、その中のチェックボックスをチェックする)を実行する必要があります。<a><label>

テストケース: http://jsfiddle.net/3M6WE/ . クリックするとfoo、チェックボックスが切り替わります。クリックbarしてもナビゲートされませんが、チェックボックスもトグルされません。

<a>要素をナビゲートせずにチェックボックスを切り替えるにはどうすればよいですか? チェックボックスを手動で切り替えるようなハックは避けたいです。preventDefault可能であれば、「部分的に」を探しています。

4

3 に答える 3

3

親要素（ラベル）のクリックをトリガーできます。

http://jsfiddle.net/3M6WE/11/

$("a").on("click", function(e) {
    e.stopPropagation();
    $(this).parent().click();
    // do stuff...
    e.preventDefault();
});

次に、魔法をかけて、最後にpreventDefault（）;を呼び出します。

于 2012-07-06T14:21:02.343 に答える
2

http://jsfiddle.net/3M6WE/10/はどうですか？を削除して問題を簡素化しますhref='#'。

于 2012-07-06T14:19:55.583 に答える
2

これを防ぐことはできないと思います：

MDNから:

ネストされた要素のクリック イベント

Gecko 8.0 (Firefox 8.0 / Thunderbird 8.0 / SeaMonkey 2.5) 以降では、バブリング クリック イベントは最大で 1 つ<label>の をトリガーし、合成クリック イベントは追加<label>の をトリガーできません。Gecko では、クリック イベントは を超えてバブル アップしますが<label>、WebKit または Internet Explorer では、クリック イベントは で停止します<label>。Gecko 8.0 より前の動作 (複数<label>の をトリガーする) により、Firefox が応答しなくなりました (バグ 646157を参照)。

于 2012-07-06T14:16:41.760 に答える