jquery - 获取检查项目，数组为空

Question

我正在尝试使用获取所有选中复选框的 ID

$(document).ready(function(){
$("#thechecked").click(function(){
    var closestTr = $(':checkbox:checked').closest('tr').attr('id');

    var arr = $.map($(closestTr), function(e, i) {
        return +e.value;
    });
   alert(arr.join(','));
});
});

示例http://jsfiddle.net/3HS8P/1/返回一个空数组

为什么它返回一个空数组？

Answer 1

attr('id')只会返回id第一个元素的，而不是全部。您可以直接映射集合。

$("#thechecked").click(function () {
    var arr = $(':checkbox:checked').closest('tr').map(function(i, e) {
        return +e.id;
    }).get();
    alert(arr.join(','));
});

http://jsfiddle.net/3HS8P/2

对 jQuery 对象执行 a.map将返回一个 jQuery 对象，因此您还需要.get()获取实际的数组，以便能够获取.join()其元素。

正如@Alnitak 在下面的评论中指出的那样，CSS 不允许样式 id 以数字开头（尽管它可能有效，但规范不允许。）。我建议使用data-id="1"而不是id="1"，然后使用$(el).data("id").

Answer 2

$(document).ready(function(){
    $("#thechecked").click(function() {
        var closestTr = $('input:checkbox:checked').closest('tr');
        var arr = closestTr.map(function(i, e) {
            return e.id;
        }).get();
       alert(arr.join(','));
    });
});

例子

Answer 3

您的行尾.attr('id')返回的是一个字符串，而不是一组元素，因此您不能将它与$.map. 试试这个通用示例，它将返回 jQuery 对象中每个元素的所有 ID $el：

var ids = $el.map(function(_, el) {
    return el.id;
}).get();

在您的情况下，根据您的原始代码自下而上地工作：

var $el = $(':checked').closest('tr');

或者（当然可能不是很有效）自上而下工作：

var $el = $('tr').has(':checked');

Answer 4

请看一下http://jsfiddle.net/3HS8P/5/

这将提醒已选中复选框的行 ID。

$("#thechecked").click(function(){
    var all_ids = []
    var id = "";
    $.each($('input[type=checkbox]'),function(){
        var checked = $(this).is(':checked')
        if (checked){
            id = $(this).closest('tr').attr('id')
            all_ids.push(id)
        } 
    });
    alert(all_ids)
});