2

更新: これは最新バージョンの Firefox (15.0.1) では機能しません: http://jsfiddle.net/DerNalia/NdrNV/5/

チェックボックスをクリックするとGoogleに移動します...しかし、そうすべきではありません:(

e.stopPropagation() を追加しても役に立たない/機能しないようです。

プレイエリア: http://jsfiddle.net/DerNalia/NdrNV/1/

私がやろうとしていること: アンカーの横にある (しかし実際には子要素である) チェックボックスをクリックすると、状態が変化し、「その他」チェックボックスの状態も変化するはずです。

しかし、アンカーには e.preventDefault() が呼び出されているため、チェックボックスはチェックされません。

ここに私のマークアップがあります

<a href="#">Link Name <input class="home" type="checkbox"/></a>
<br />
Sync'd checkbox: <input class="other" type="checkbox" />​

ここにいくつかの問題のあるjqueryがあります

$(function() {
    $("input.home").click(function() {
        $("input.other").click();
    });

    $("a").click(function(e) {
        e.preventDefault();
        // prevent default so we can do some ajaxy things instead of follow the href
    });
})​

では、クリックが子要素に伝播するようにアンカー タグの jQuery クリック アクションを変更するにはどうすればよいでしょうか (ただし、ブラウザがアンカー タグの href をたどらなくても ajaxy を行うことはできます)。

マークアップを変更せずにこれを行う方法はありますか? （現在の方法は、私のWebアプリケーションにとって意味のあるものです）

4

3 に答える 3

1

条件 e.target.tagName を次のように配置できます。

 if(e.target.tagName == 'A')        
       e.preventDefault();

ライブデモ

$(function() {
    $("input.home").click(function() {
        $("input.other").click();
    });

    $("a").click(function(e) {
        if(e.target.tagName == 'A')        
           e.preventDefault();      


        // prevent default so we can do some ajaxy things instead of follow the href
    });
})​
于 2012-08-13T15:26:45.867 に答える
1

event.preventDefaultイベントがキャンセルされるため、機能しません。

checkbox内側にラップされているクリックで e.preventDefault を使用する<a>と、チェックボックスの状態を変更できません。

私が考えることができる回避策は、チェックボックスの状態を別のコンテキストに設定して、e.preventDefaultコードが無効になるようにすることです。

デモ: http://jsfiddle.net/NdrNV/10/

$(function() {
    $("input.home").click(function() {
        $("input.other").click();
    });

    $("a").click(function(e) {
        e.preventDefault();

        var setCheckbox = function() {
            var checkbox = $(e.target)[0];
            checkbox.checked = checkbox.checked?false:true;
        }

        if ($(e.target).is(':checkbox')) {
            setTimeout(setCheckbox, 0);
        }

    });
})

注:これは回避策です。

于 2012-09-19T19:36:29.760 に答える
0 
$(function() {
        $("input.home").click(function() {
            if($(this).attr('checked') == 'checked')
                $(this).removeAttr('checked');
            else                               
                $(this).attr('checked', 'checked');
            $("input.other").click();
        });

    $("a").click(function(e) {
        e.preventDefault();
        // prevent default so we can do some ajaxy things instead of follow the href

        var target = e.target; // object that triggers the event
        $(target).children().trigger('click');
    });
});
于 2012-08-13T15:17:07.967 に答える