6

単純なjQuery関数を使用してテーブル内にチェックボックスのリストがあり、ユーザーはテーブル行の任意の場所をクリックしてチェックボックスをオン/オフにすることができます。ユーザーが実際にチェックボックスをクリックする場合を除いて、これはうまく機能します。その時は動作しません。何か案は？これが私のコードです：

HTML：

<tr onClick="checkBox()">...</tr>

jQuery：

function checkBox() {

var ischecked = $('input#myContacts').attr("checked");

if(ischecked)
{
    $('input#myContacts').attr("checked", false);
}
else
{
    $('input#myContacts').attr("checked", true);
}

return false;
}
4

4 に答える 4

8

を使用して、のクリックイベントがのクリックイベントに伝播しevent.stopPropagationないようにすることができます。また、jQueryイベントを使用する必要があるときに、jQueryとDOMをそのように混合しているとはまだ信じられません。input#myContactstr

$(document).ready(function(){
  $("input#myContacts").click(function(e){
    e.stopPropagation();
  });
});
于 2012-05-19T08:26:54.163 に答える
0

その関数がトリガーされる理由を示すHTMLがなければ、言うのは難しいです。jsFiddleが役立ちます。単なる憶測ですが、チェックボックスをクリックしてチェックしているのに、クリックイベントがすぐにその関数を呼び出してチェックを外している可能性がありますか？

于 2012-05-19T08:08:43.993 に答える
0 
   <tr class="checkBox">...</tr>


    $(document).ready(function () {
        $('tr.checkBox').live('click', function (e) {
            if (e.target.type !== 'checkbox') {
                $('input#myContacts').attr("checked", function () {
                    return !$(this).prop('checked');
                });

                //Or

                $(this).find('input#myContacts').attr("checked", function () {
                    return !$(this).prop('checked');
                });
            }
        });
    });
于 2012-05-19T09:18:57.903 に答える
0

解決策1： http: //jsfiddle.net/qmdGK/3/（2つのテーブルセルを使用しますが、クリックをテキストセルにバインドするだけです）

解決策2： http: //jsfiddle.net/qmdGK/4/（チェックボックスのクリックイベントでstopPropagation（）を使用）

どちらもjQueryを使用して、優先される要素にイベントをバインドしています。

于 2012-05-19T16:24:49.683 に答える