Den Wert eines markierten Kontrollkästchens abrufen?

Question

Ich habe also einen Code, der wie folgt aussieht:

<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">

Ich brauche nur Javascript, um den Wert des aktuell angekreuzten Kästchens zu erhalten.

EDIT : Um etwas hinzuzufügen, muss nur EIN Kästchen angekreuzt werden.

Answer 1

Keine der oben genannten Methoden hat bei mir funktioniert, aber ich benutze einfach diese:

document.querySelector('.messageCheckbox').checked;

Answer 2

Bei modernen Browsern :

var checkedValue = document.querySelector('.messageCheckbox:checked').value;

Durch die Verwendung von jQuery :

var checkedValue = $('.messageCheckbox:checked').val();

Reines Javascript ohne jQuery :

var checkedValue = null; 
var inputElements = document.getElementsByClassName('messageCheckbox');
for(var i=0; inputElements[i]; ++i){
      if(inputElements[i].checked){
           checkedValue = inputElements[i].value;
           break;
      }
}

Answer 3

Ich verwende dies in meinem Code, z.B. so

var x=$("#checkbox").is(":checked");

Wenn das Kontrollkästchen aktiviert ist x ist wahr, andernfalls ist sie falsch.

Answer 4

In einfachem Javascript:

function test() {
    var cboxes = document.getElementsByName('mailId[]');
    var len = cboxes.length;
    for (var i=0; i<len; i++) {
        alert(i + (cboxes[i].checked?' checked ':' unchecked ') + cboxes[i].value);
    }
}

function selectOnlyOne(current_clicked) {
    var cboxes = document.getElementsByName('mailId[]');
    var len = cboxes.length;
    for (var i=0; i<len; i++) {
        cboxes[i].checked = (cboxes[i] == current);
    }
}

Answer 5

Dies ist zwar keine direkte Antwort auf die Frage, kann aber zukünftigen Besuchern helfen.

---

Wenn Sie möchten, dass eine Variable immer den aktuellen Zustand des Kontrollkästchens angibt (anstatt den Zustand immer wieder überprüfen zu müssen), können Sie die onchange Ereignis, um diese Variable zu setzen.

Dies kann in der HTML-Datei erfolgen:

<input class='messageCheckbox' type='checkbox' onchange='some_var=this.checked;'>

oder mit JavaScript:

cb = document.getElementsByClassName('messageCheckbox')[0]
cb.addEventListener('change', function(){some_var = this.checked})