如何使用jquery从checkboxlist控件中获取复选框的选定索引？答案

【问题标题】：how to get the selected index of check box from checkboxlist control using jquery?如何使用jquery从checkboxlist控件中获取复选框的选定索引？
【发布时间】：2010-05-21 17:01:33
【问题描述】：

您好，如何使用jquery从checkboxlist控件中获取复选框的selectedindex？

更新：

此代码给我选择的索引等于 0 请建议

<asp:CheckBoxList ID="chkListGroups" runat="server" 
                    style="position:absolute; top: 1115px; left: 745px; bottom: 371px;" 
                    DataSourceID="SqlDSGroups" DataValueField="Groups" 
                    onclick="test()">
                </asp:CheckBoxList>


....................
java script function
.....................
  function test(){
  $('#<%=chkListGroups.ClientID %>').click(function() {
                var selectedIndex = $('#<%=chkListGroups.ClientID %>').index($(this));


                alert(selectedIndex);


            });
        }

【问题讨论】：

你说的是 ASP.Net 吗？
@SLaks：如果是客户端，那就没关系了。
@R0MANARMY：这取决于复选框列表是什么。
我正在使用 asp.net checkboxlist 但我想使用 jquery 在客户端获取选定索引

标签： jquery checkboxlist

【解决方案1】：

对集合使用选择器，然后将索引与您感兴趣的元素一起使用，这里是选中的元素。

var checkboxes = $('input:checkbox');
var selectedIndex = checkboxes.index(checkboxes.find(':checked'));

要获取点击复选框的索引，请使用：

$('input:checkbox').click( function() {
    var selectedIndex = $('input:checkbox').index( $(this) );
    ... now do something with it...
});

编辑：基于您的代码示例：

var checkboxes = $('#<%=chkListGroups.ClientID %>').find('input:checkbox');
checkboxes.click(function() { 
    var selectedIndex = checkboxes.index($(this)); 
    alert(selectedIndex); 

});

【讨论】：

我想要的正是被点击复选框的索引
@Eyla - 我添加了一个单击处理程序的示例，它将为您提供单击复选框的索引。
@tvanfosson 我使用您的代码来获取选定的索引，但无论我选择哪个复选框，我总是得到 0 索引。有什么建议吗？？
@Eyla - 哪个样本，第一个还是第二个？第二个会给你被点击的那个。第一个会给你第一个选中的。
@tvanfosson 第二个总是给我选择的索引 =0 请在主要问题中查看更新的代码

【解决方案2】：

get value: $("input:checked").val();
get id: $("input:checked").attr('id');

//or this:
var counter=0;
$('input:checkbox').each(function(){
   if($(this).is(":checked"))
   {
     var Index = counter;
   }
   else{
     counter++;
   }

   //So Index is what you want.
});

我没有对此进行测试，但它类似于此代码。希望对你有帮助

【讨论】：

您确实意识到 jQuery each (api.jquery.com/each) 函数已经为您跟踪索引并将其作为参数传递到您的回调中，因此您无需手动保留计数，对吗？
其实我也不知道。感谢您的评论。

【解决方案3】：

如果你需要最后选中的复选框的索引，就这样

var query = (from o in CheckBoxList1.Items.OfType<ListItem>()  
                     where o.Selected  
                     select o).Take(1).Reverse().ToList();

【讨论】：

OMFG！所有这些代码都是为了获得一个选定的索引？！你应该考虑其他编程语言，伙计......
这如何让您获得选定的索引？这只是获取包含其中第一个选定元素的列表的一种非常奇怪的方法。
sh*t 我的错误，这只会给你所选项目的最后一个索引....oops
你不觉得这是一个很大的开销吗？
@VoodooChild：所以问题是关于获取选定项目客户端，因为您的代码是服务器端 C# 代码。此外，您的代码只返回元素，而不是列表中元素的索引（如所要求的问题）。最后，如果问题是关于获取列表中的第一个选定元素，使用CheckBoxList1.Items.OfType<ListItem>().FirstOrDefault( s => s.Selected ) 获取它会容易得多。