我在更新面板(网络表单)中有一个gridview.网格视图有一个标题复选框,因此当您单击标题复选框时,它会检查它下面的所有项目复选框,如下所示：
<asp:TemplateField>
<HeaderTemplate>
<asp:CheckBox ID="HeaderLevelCheckBox" runat="server"
onclick="toggleSelection(this);" ToolTip="Select / Deselect all rows?" />
</HeaderTemplate>
<ItemTemplate>
<asp:CheckBox ID="chkSelector" runat="server" ToolTip="Select row?" />
</ItemTemplate>
</asp:TemplateField>
注意函数调用onclick =“toggleSelection(this);”这看起来像这样：
function toggleSelection(source) {
$("#MainContent_gvCG input[id*='chkSelector']").each(function (index) {
$(this).attr('checked',source.checked);
if (source.checked)
$(this).css({ backgroundColor: "yellow" });
else
$(this).css({ backgroundColor: "" });
});
}
这是在document.ready在script标签之后声明的.当我最初加载页面并单击headercheckBox时,gridview中的所有行也被选中(很棒……有效).如果我取消选中它,所有行都将被取消选中(很棒).当我再次点击它时,UI不会改变(所有项目都不会像它们应该那样被检查).
我很好奇,在检查标记时也是对的,当我点击标题将其检查为true时,我得到了检查的行项：
< input id =“MainContent_gvCG_chkSelector_5”type =“checkBox”name =“ctl00 $MainContent $gvCG $ctl08 $chkSelector”style =“background-color：rgb(255,255,0);”检查= “检查” > 当我取消选中标题时,它会像这样正确响应： < input id =“MainContent_gvCG_chkSelector_5”type =“checkBox”name =“ctl00 $MainContent $gvCG $ctl08 $chkSelector”style =“”>
我的问题是UI没有改变,这意味着即使标记显示正在检查,复选框也不会显示为被检查.这是因为在更新面板内吗？
我该怎么做才能解决这个问题？
解决方法
尝试使用jQuery prop而不是attr,它接受一个布尔值而不是使用attr / removeAttr checked属性.
码：
function toggleSelection(source) {
$("#MainContent_gvCG input[id*='chkSelector']").each(function (index) {
$(this).prop('checked',source.checked);
if (source.checked)
$(this).css({ backgroundColor: "yellow" });
else
$(this).css({ backgroundColor: "" });
});
}
