Ottieni il valore della casella di controllo selezionata?

Quindi ho un codice simile al seguente:

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

Ho solo bisogno di Javascript per ottenere il valore di qualsiasi casella attualmente selezionata.

EDIT : Per aggiungere, ci sarà solo UNA casella selezionata.

Per i browser moderni :

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

UtilizzandojQuery :

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

Javascript puro senzajQuery :

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

Nessuno dei precedenti ha funzionato per me, ma semplicemente usa questo:

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

Buona codifica.

Sto usando questo nel mio codice. Prova questo

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

Se la casella è selezionata xsarà vera, altrimenti sarà falsa.

in javascript semplice:

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

Questo non risponde direttamente alla domanda, ma può aiutare i futuri visitatori.

Se si desidera che una variabile sia sempre lo stato corrente della casella di controllo (anziché dover continuare a controllarne lo stato), è possibile modificare l' onchangeevento per impostare quella variabile.

Questo può essere fatto in HTML:

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

o con JavaScript:

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

Usa questo:

alert($(".messageCheckbox").is(":checked").val())

Ciò presuppone che le caselle di controllo da controllare abbiano la classe "messageCheckbox", altrimenti dovresti fare un controllo se l'input è il tipo di casella di controllo, ecc.

<input class="messageCheckbox" type="checkbox" onchange="getValue(this.value)" value="3" name="mailId[]">

<input class="messageCheckbox" type="checkbox" onchange="getValue(this.value)" value="1" name="mailId[]">

function getValue(value){
    alert(value);
}

Se si utilizza React dell'interfaccia utente semantica , dataviene passato come secondo parametro onChangeall'evento.

È quindi possibile accedere alla checkedproprietà come segue:

<Checkbox label="Conference" onChange={(e, d) => console.log(d.checked)} />

Nessuna delle precedenti ha funzionato per me senza generare errori nella console quando la casella non era selezionata, quindi ho fatto qualcosa lungo queste linee (onclick e la funzione checkbox sono utilizzate solo a scopo dimostrativo, nel mio caso d'uso fa parte di un funzione di invio modulo molto più grande):

function checkbox() {
  var checked = false;
  if (document.querySelector('#opt1:checked')) {
     checked = true;
  }
  document.getElementById('msg').innerText = checked;
}

<input type="checkbox" onclick="checkbox()" id="opt1"> <span id="msg">Click The Box</span>

Nel mio progetto, di solito uso questi frammenti:

var type[];
$("input[name='messageCheckbox']:checked").each(function (i) {
                type[i] = $(this).val();
            });

E funziona bene. Distinti saluti.