将复选框值映射到空数组

Mapping checkbox values to an empty array

本文关键字:数组 映射 复选框      更新时间:2023-09-26

我有一系列绑定到复选框的数组。

下面是HTML:

<input type="checkbox" value="value1">Value 1
<input type="checkbox" value="value2">Value 2
<input type="checkbox" value="value3">Value 3

在我的jQuery中,我有这些数组定义如下:

var value1 = ['item1', 'item2', 'item3'];
var value2 = ['itemA', 'itemB', 'itemC'];
var value3 = ['item!', 'item@', 'item#'];

我想创建一个基于这些复选框被选中的新数组,本质上是一个数组的数组。我已经尝试了以下代码,但它不工作:

var newArray = [];
$('input[type=checkbox]:checked').map(function(){
    newArray.push($(this).val());
});

我可以硬编码newArray如下:

var newArray = [value1, value2, value3];

在填充newArray之后,我想循环遍历newArray中包含的数组的值,以选择随机索引并将它们推入randArray。这部分工作,如果我硬编码newArray如下:

var newArray = [itemC, item!, item1]

但是如果我尝试将复选框值映射到newArray,它将不起作用。一旦我填充了newArray,我要确保在randArray中至少包含了newArray中每个子集的一个项目。我目前有困难的部分是根据检查的内容用子集填充newArray。

我试图完成的一个例子类似于http://passwordsgenerator.net/

此语法不将复选框值设置为名称为value1:

的js变量的值。
<input type="checkbox" value="value1">Value 1

你可能需要这样做:

<input type="checkbox" value="item1,item2,item3">Value 1
<input type="checkbox" value="itemA,itemB,itemC">Value 2
<input type="checkbox" value="item!,item@,item#">Value 3

然后你的newArray创建看起来像这样:

var newArray = [];
$('input[type=checkbox]').map(function () {
    var $cb = $(this);
    if ($cb.is(":checked")) {
        newArray.push($cb.val().split(','));
    } else {
        newArray.push([]);
    }
});

看这个小提琴:

http://jsfiddle.net/slippery_pete/ddpnhww5/1/