jQuery获取选中checkbox的值到数组中

我正在尝试获取当前选中的所有checkbox的值，并将它们存储到一个数组中。 这是我的代码到目前为止：

$("#merge_button").click(function(event){ event.preventDefault(); var searchIDs = $("#find-table input:checkbox:checked").map(function(){ return $(this).val(); }); console.log(searchIDs); }); 

然而这个输出比我需要的更多。 我不仅得到了价值，还有一些我不想要的东西。

[“51729b62c9f2673e4c000004”，“517299e7c9f26782a7000003”，“51729975c9f267f3b5000002”，prevObject：jQuery.fn.jQuery.init [3]，context：document，jquery：“1.9.1”，constructor：function，init：function …]

我想只是身份证（在这种情况下，前3项）。

通过使用$.each并将值推送到数组我得到所需的输出：

 $("#find-table input:checkbox:checked").each(function(){ myArray.push($(this).val()); }) 

[“51729b62c9f2673e4c000004”，“517299e7c9f26782a7000003”，“51729975c9f267f3b5000002”]

不过，我想使用$.map ，因为它为我节省了一行代码，而且更漂亮。

谢谢

Answer 1

在最后调用.get()将生成的jQuery对象转换为一个真正的数组。

 $("#merge_button").click(function(event){ event.preventDefault(); var searchIDs = $("#find-table input:checkbox:checked").map(function(){ return $(this).val(); }).get(); // <---- console.log(searchIDs); }); 

根据文档 ：

由于返回值是一个包含数组的jQuery对象，所以在结果上调用.get（）以使用基本数组是非常常见的。

Answer 2

DEMO： http : //jsfiddle.net/PBhHK/

 $(document).ready(function(){ var searchIDs = $('input:checked').map(function(){ return $(this).val(); }); console.log(searchIDs.get()); }); 

只要调用get（），你就可以得到你的数组了： http ： //api.jquery.com/map/

 $(':checkbox').map(function() { return this.id; }).get().join(); 

Answer 3

您需要将.toArray()添加到.map()函数的末尾

 $("#merge_button").click(function(event){ event.preventDefault(); var searchIDs = $("#find-table input:checkbox:checked").map(function(){ return $(this).val(); }).toArray(); console.log(searchIDs); }); 

演示： http : //jsfiddle.net/sZQtL/

Answer 4

我重构了一下你的代码，并相信我提供了你正在寻找的解决scheme。 基本上，而不是将searchIDs设置为.map()的结果，我只是将值推入数组。

 $("#merge_button").click(function(event){ event.preventDefault(); var searchIDs = []; $("#find-table input:checkbox:checked").map(function(){ searchIDs.push($(this).val()); }); console.log(searchIDs); }); 

我创build了一个代码运行的小提琴 。

Answer 5

  var ids = []; $('input[id="find-table"]:checked').each(function() { ids.push(this.value); }); 

这个为我工作！

Answer 6

不要使用“每个”。 它用于操作和更改相同的元素。 使用“map”从元素体中提取数据并在其他地方使用它。

Answer 7

需要将HTML中作为数组命名的表单元素作为javascript对象中的数组，就像表单实际上已经提交一样。

如果存在具有多个checkbox的表单，例如：

 <input name='breath[0]' type='checkbox' value='presence0'/> <input name='breath[1]' type='checkbox' value='presence1'/> <input name='breath[2]' type='checkbox' value='presence2'/> <input name='serenity' type='text' value='Is within the breath.'/> ... 

结果是一个对象：

 data = { 'breath':['presence0','presence1','presence2'], 'serenity':'Is within the breath.' } var $form = $(this), data = {}; $form.find("input").map(function() { var $el = $(this), name = $el.attr("name"); if (/radio|checkbox/i.test($el.attr('type')) && !$el.prop('checked'))return; if(name.indexOf('[') > -1) { var name_ar = name.split(']').join('').split('['), name = name_ar[0], index = name_ar[1]; data[name] = data[name] || []; data[name][index] = $el.val(); } else data[name] = $el.val(); }); 

在这里有很多的答案，这有助于改善我的代码，但他们要么太复杂，或没有完全想要我想要的： 使用jQuery将表单数据转换为JavaScript对象

工作，但可以改善：只适用于一维数组和结果索引可能不顺序。 数组的length属性返回下一个索引号作为数组的长度，而不是实际的长度。

希望这有助于。 合十！