Question

我在php中有一个for循环，在我的页面上添加了一些看起来像这样的复选框

<input type="checkbox" name="checkbox[]">

我想使用javascript来检查哪个被检查并在数组中添加值

var cboxes = document.getElementsByName('checkbox[]');
var len = cboxes.length;
var imageArray = new Array();

for (var i = 0; i < len; i++) {
    if (cboxes[i].checked) {
        imageArray[i] = cboxes[i].value;
    } 
}

如果我有50个盒子并单击复选框号2,4和6，循环遍历我的阵列，我得到结果。

for(var i = 0; i < imageArray.length; i++){
    gallery.innerHTML += imageArray[i] + "<br>";
}

-

undefined
Correct value
undefined
Correct value
undefined
Correct value

如果我检查数字1,2,3我得到结果

Correct value
Correct value
Correct value

为什么在跳过复选框时我未定义？我该如何解决？

Answer 1

这是因为您要向数组添加额外的元素。拿这个代码，例如：

var a = []; // empty array
a[1] = 'foo'; // don't set a[0]

console.log(a.length); // gives 2

Javascript将始终＆＃34;填写＆＃34;数组键列表中的间隙。如果您错过了一些，Javascript将使用undefined填充空白。

不是通过键名将元素添加到数组中，而是将push添加到数组的末尾：

imageArray.push(cboxes[i].value);

Answer 2

由于您正在imageArray中跳过索引，因此未定义。如果未选中第一个复选框，则不会在索引0中放置任何内容，因为选中了第二个复选框，第一个条目将放入索引1中。

当你迭代时，如果是一个带有值的索引，那么它就不会跳过那些错过的索引，它们只是没有设定值，所以它返回{{1} }。

您可以更改此行：

undefined

为：

imageArray[i] = cboxes[i].value;

这样，当有未选中的复选框时，将不会跳过索引。

Answer 3

这是因为在选中相应的复选框时，您只设置imageArray[i] 的值。如果选中复选框2,4和6，则基本上是这样做的：

imageArray[1] = cboxes[1].value;
imageArray[3] = cboxes[3].value;
imageArray[5] = cboxes[5].value;

imageArray[0]，[2]和[4]永远不会被设置，因此是undefined。

要解决此问题，请使用push()将值推送到imageArray，或者只为非匹配键设置虚拟值：

    for (var i = 0; i < len; i++) {
        if (cboxes[i].checked) {
            imageArray[i] = cboxes[i].value;
        } else {
            imageArray[i] = "";
        }
    }

结果：

imageArray[0] = "";
imageArray[1] = cboxes[1].value;
imageArray[2] = "";
imageArray[3] = cboxes[3].value;
imageArray[4] = "";
imageArray[5] = cboxes[5].value;

或者使用push()：

    for (var i = 0; i < len; i++) {
        if (cboxes[i].checked) {
            imageArray.push(cboxes[i].value);
        }
    }

结果：

imageArray[0] = cboxes[1].value;
imageArray[1] = cboxes[3].value;
imageArray[2] = cboxes[5].value;

Answer 4

试试这个

var cboxes = document.getElementsByName('checkbox[]');
var imageArray =[];

for (var i = 0, len = cboxes.length ; i < len; i++) {
    if (cboxes[i].checked) {
        imageArray.push(cboxes[i].value );
    } 
}

Answer 5

您正在设置imageArray相对于变量i，

循环每次都在执行，因此它为数组中那些未设置的元素设置了未定义的值，

您应该使用不同的循环变量，并仅在成功条件下增加其值。

尝试修改循环，如下所示。

        var j=0;
        for (var i = 0; i < len; i++) {
            if (cboxes[i].checked == true) {
                imageArray[j] = cboxes[i].value;
                j++;
            }
        }

为什么我的数组中的某些值未定义

5 个答案: