Показать все выбранные флажки

Question

Я пытаюсь отобразить все выбранные флажки из этой формы.

<form name="myform"> 
     Select a check box: <br> <br> 
     Check Box 0: <input TYPE="checkbox" NAME="checkBox" checked> <br> 
     Check Box 1: <input TYPE="checkbox" NAME="checkBox"> <br> 
     Check Box 2: <input TYPE="checkbox" NAME="checkBox"> <br> 
     Check Box 3: <input TYPE="checkbox" NAME="checkBox"> <br> <br> 
     <input type="button" name="button" Value="Click Me" onClick="getCheckedBoxes(this.form)"> 
</form> 

Код JS. Я застрял здесь сейчас и не могу заставить его работать. Заранее спасибо.

function getCheckedBoxes(checkBox) { 
     var checkboxes = document.getElementsByName(checkBox); 
     var checkboxesChecked = []; 

     for (var i=0; i<checkboxes.length; i++) { 
     if (checkboxes[i].checked) { 
      checkboxesChecked.push(checkboxes[i]); 
     } 
     } 
     return checkboxesChecked.length > 0 ? checkboxesChecked : null; 
    } 

    var checkedBoxes = getCheckedBoxes("checkBox"); 

    alert ("Check box " + checkedBoxes + " is selected "); 

Answer 1

Вам необходимо предупредить внутри функции, которую вы вызываете onclick, и вам нужно сохранить индекс вместо объекта. Если вы храните объект, вы будете предупреждать

Check box: [object HTMLInputElement],[object HTMLInputElement] is selected 

вместо индекса.

Live Demo

function getCheckedBoxes(boxName) { 
    var checkboxes = document.getElementsByName(boxName); 
    var checkboxesChecked = []; 

    for (var i=0; i<checkboxes.length; i++) { 
    if (checkboxes[i].checked) { 
     checkboxesChecked.push(i); // or i+1 if you want 1-based 
    } 
    } 
    return checkboxesChecked.length > 0 ? checkboxesChecked : "none"; 
} 

function count(name) { 
    alert ("Checked boxes: " + getCheckedBoxes(name)); 
} 

использованием

<input type="button" name="button" Value="Click Me" onClick="count('checkBox')">