Question

我在Popup中有一个复选框列表。我在jquery中使用了selectall checkboxlist items函数。问题是当我选中selectall复选框时，它会在弹出窗口和网页中选择所有复选框列表项。如何使它只在弹出窗口中选择checkboxlist项目。我的代码为

 <td>   <div style="text-align: left; margin: auto;">
                    <asp:CheckBox ID="chkSelectReportAll" runat="server" Text="Select All" onclick="checkall()"/>
                    <asp:CheckBoxList ID="chkReportLst" runat="server">
                    </asp:CheckBoxList>
        </div>
 </td>

我的脚本为

function checkall() {
   $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').click(
    function () {
     if (document.getElementById('chkReportLst'))                    
   $("INPUT[type='checkbox']").attr('checked', $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));
            });
        }

有什么建议吗？

Answer 1

肯定是在做之前你必须添加class =＆＃34; popupCheckbox＆＃34;在弹出窗口中的复选框

jQuery 1.6 +

使用新的.prop()功能：

$(".popupCheckbox").prop("checked", true);
$(".popupCheckbox").prop("checked", false);

jQuery 1.5及以下

.prop（）函数不可用，因此您需要使用.attr()。

要选中复选框（通过设置checked属性的值），请执行

$('.popupCheckbox').attr('checked','checked')

并取消检查（完全删除属性）

$('.popupCheckbox').removeAttr('checked')

Answer 2

为<div>分配ID，这样您就可以将选择器缩小到其中的输入范围。

<div id="cntCheckBoxList" style="text-align: left; margin: auto;">
    <asp:CheckBox ID="chkSelectReportAll" runat="server" Text="Select All" onclick="checkall()"/>
    <asp:CheckBoxList ID="chkReportLst" runat="server"></asp:CheckBoxList>
</div>

选择器变为：

$("#cntCheckBoxList INPUT[type='checkbox']").attr('checked',    $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));

Answer 3

更改此行

$("INPUT[type='checkbox']").attr('checked',
   $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));

要

$("#any_parent_in_popup INPUT[type='checkbox']").attr('checked',
       $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));

将#any_parent_in_popup替换为弹出窗口内的任何父元素ID，并包含所有复选框。如果您没有，可以考虑添加一个。

Answer 4

function checkall() {
   $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').click(function () {
      $("#chkReportLst INPUT[type='checkbox']").attr('checked', $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));
   });
}

Answer 5

目前您遇到的问题是，当您选择$("INPUT[type='checkbox']")复选框时，jQuery会查看整个页面上的所有复选框，如您所述。

您想要的是属于chkReportLst的所有复选框。

为了便于阅读，我倾向于使用.find()函数将其作为jQquery子选择器。

因此，首先选择您的复选框列表，然后使用.find（）选择复选框，该复选框是该列表的子元素：

$("#chkReportLst").find("INPUT [type='checkbox']").attr('checked', $('#MainContent_uscOptionsPOPUP_chkSelectReportAll').is(':checked'));

使用jquery在Popup中选择所有checkboxlist

5 个答案:

jQuery 1.6 +

jQuery 1.5及以下