如何使用 jquery 获取所选 Asp.net checkBoxList 项目的索引及其文本值

Question

如何使用 jQuery 获取所选 ASP.NET CheckBoxList 项目的索引及其文本值

我使用了列出的代码，但它对我不起作用。

前两行将返回带有“未定义”字符串的消息，

var index = $('#<%=chkListGroups.ClientID %>').attr("selectedIndex");
alert(index);

后两行将返回空消息。

var text = $('#<%=chkListGroups.ClientID %>').val();
alert(text);

Answer 1

var indices = '';
$('#<%=chkListGroups.ClientID %> input:checkbox').each(function (index) { 
   if ($(this).filter('input:checkbox:checked').length == 1) { 
       indices += (index + ' '); 
   }
});
alert(indices);

应该打印索引。

如果“文本值”是指从 ASP.NET 中 ListItem 元素的 Value 属性返回的内容，则它不会自动直接包含在网页中。解决此问题的一种方法是在页面的 .NET 代码中创建 Value 属性的 javascript 数组，然后使用与上面类似的方法来查找数组中的值。如果该数组称为“valueArray”，那么您可以将上面“if”正文中的代码替换为

indices += (valueArray[index] + ' ');

我希望这有帮助——我当然欢迎任何问题。

编辑（以下提交者的评论）：

如果您想要每个选中项目的可见标签，这应该有效：

var text = $('#<%=chkListGroups.ClientID %> input:checkbox:checked').siblings('label').text();
alert(text);

Answer 2

编辑：误读了您原来的问题 - 相应更新此答案。

ASP.NET 将 checkBoxList 控件呈现为一系列复选框（您可以使用 firebug 轻松查看呈现的控件）。我相信它会根据您指定的 ID 分配每个复选框的 ID。例如：

<asp:CheckBoxList id="list1" runat="server">
    <asp:ListItem>One</asp:ListItem>
    <asp:ListItem>Two</asp:ListItem>
    <asp:ListItem>Three</asp:ListItem>
</asp:CheckBoxList>

在 HTML 中呈现为：

<table id="list1">
    <tr><td><input id="list1_0" type="checkbox" /><label for="list1_0">One</label></td></tr>
    <tr><td><input id="list1_1" type="checkbox" /><label for="list1_1">Two</label></td></tr>
    <tr><td><input id="list1_2" type="checkbox" /><label for="list1_2">Three</label></td></tr>
</table>

您可以通过以下方式确定某个框是否被选中：

$('#list1_0').attr('checked')

您还可以通过以下方式找到它们：

$('#list1 input')

... 然后使用 jQuery 迭代扫描所有复选框。我怀疑 jQuery 也可用于在目标复选框控件之后查找下一个“标签”控件，并从中提取实际文本。 stackoverflow 的 jQuery 大脑之一必须帮助解决精确的选择器语法 - 我对 jQuery 比较陌生，而且一时不知道它。

原始响应（适用于简单的选择列表）：

这应该获取所选索引：

$("#SomeListID").attr("selectedIndex")

这应该获取所选值：

$("#SomeListID").val()