0

ラベルをクリックしたときにチェックボックスのクリックイベントが実行されたのはなぜだろうと思っていました。ラベルをクリックしたときに実行を防ぐ方法を教えてください

//クリックイベント

//これを試してみます

 $("input:checkbox[name*='chkFields']").click(function (evt) {
        if ($(evt.target).is("input")) {
            if ($(this).attr("checked") == "checked") {
}}});

//そしてこれも

$("input:checkbox[name*='chkFields']").click(function () {
        if ($(this).attr("checked") == "checked") {
         logic here....
}
});

// HTML

<div class="FloatLeft" id="draggableElements">

               <div style="width: auto!important; margin-bottom: 0px;" class="TableCellHeader metooltip ellipsis" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_divHeader" title="
                   Employee 

               ">
                   Employee 
               </div>
               <div style="margin-bottom:5px">
                   <table class="checkbox" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields">
                                                        <tbody>
                                                        <tr>
                                                            <td>
                                                                <span class="aspNetDisabled">
                                                                    <input type="checkbox" value="106" disabled="disabled" checked="checked" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl00$chkFields$0" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_0" style="visibility: hidden;">
                                                                    <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_0">Employee Name</label>
                                                                </span>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <span>
                                                                    <input type="checkbox" value="20" checked="checked" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl00$chkFields$1" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_1">
                                                                    <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_1">Job</label>
                                                                </span>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <span>
                                                                    <input type="checkbox" value="21" checked="checked" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl00$chkFields$2" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_2">
                                                                    <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl00_chkFields_2">Age</label>
                                                                </span>
                                                            </td>
                                                        </tr>
                                                    </tbody></table>
               </div>

               <div style="width: auto!important; margin-bottom: 0px;" class="TableCellHeader metooltip ellipsis" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_divHeader" title="
                   Sample text

               ">
                   Sample text
               </div>
               <div style="margin-bottom:5px">
                   <table class="checkbox" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields">
                                                        <tbody><tr>
                                                            <td>
                                                                <input type="checkbox" value="89" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl01$chkFields$0" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_0">
                                                                <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_0">Amount</label>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <input type="checkbox" value="90" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl01$chkFields$1" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_1">
                                                                <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_1">Percent</label></td>
                                                        </tr>
                                                        <tr>
                                                            <td>
                                                                <input type="checkbox" value="91" name="ctl00$ContentPlaceHolderContent$sbMain$ctl01$sbGroups$ctl01$DraggableListID$repColumnCategory$ctl01$chkFields$2" id="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_2">
                                                                <label for="ctl00_ContentPlaceHolderContent_sbMain_ctl01_sbGroups_ctl01_DraggableListID_repColumnCategory_ctl01_chkFields_2">Adjustment</label>
                                                            </td>
                                                        </tr>
                                                    </tbody></table>
               </div>



 </div>
4

2 に答える 2

1

私はこれを管理しようとします。ここにコードスニペットがあります

 $("label[for*='chkFields']").click(function(ev) { ev.preventDefault(); });
于 2013-02-16T13:13:50.747 に答える
1

やらないでください。

これは、非常に小さな四角いボックスをクリックする器用さを持たないほとんどの人に見られる動作です。ただし、適切に関連付けられた説明的なラベルをクリックすると、非常に簡単になります.

また、視覚障害者のスクリーン リーダーにも役立つと確信しています。

于 2013-02-16T12:59:01.760 に答える