Почему некоторые значения в моем массиве не определены?

У меня есть цикл for в php, который добавляет несколько флажков на моей странице, которые выглядят так

<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 

Почему я не могу определить, когда я пропускаю флажок? Как это исправить?

Это связано с тем, что вы добавляете дополнительные элементы в массив. Возьмите этот код, например:

 var a = []; // empty array a[1] = 'foo'; // don't set a[0] console.log(a.length); // gives 2 

Javascript всегда будет «заполнять» пробелы в списке ключей массива. Если вы пропустите некоторые из них, Javascript заполнит пробелы с undefined .

Вместо того, чтобы добавлять элемент в ваш массив по имени ключа, просто push его в конец массива:

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

Вы получаете undefined, потому что вы пропускаете индексы в imageArray . Если первый флажок не установлен, он не будет помещать что-либо в индекс 0, а потому, когда установлен второй флажок, первая запись помещается в индекс 1.

Когда вы повторяете, он не пропускает пропущенные индексы, если после него есть индекс со значением, они просто не имеют заданного значения, поэтому оно возвращается как undefined .

Вы можете изменить эту строку:

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

чтобы:

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

Таким образом, он не будет пропускать индексы, когда отмечены флажки без отметки.

Это связано с тем, что вы устанавливаете значение 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; 

попробуй это

 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 ); } } 

Вы устанавливаете imageArray относительно переменной i,

цикл выполняется каждый раз и, следовательно, он устанавливает неопределенное значение для тех элементов в массиве, которые не установлены,

вы должны использовать другую переменную цикла и увеличить ее значение только в успешном состоянии.

Попробуйте изменить цикл, как показано ниже.

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