Obtenir la valeur de la case cochée?

J'ai donc du code qui ressemble à ceci:

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

J'ai juste besoin de Javascript pour obtenir la valeur de la case à cocher actuellement cochée.

EDIT : Pour ajouter, il n'y aura qu'une seule case cochée.

Pour les navigateurs modernes :

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

En utilisantjQuery :

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

JavaScript pur sansjQuery :

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

Rien de ce qui précède n'a fonctionné pour moi, mais utilisez simplement ceci:

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

Bon codage.

J'utilise ceci dans mon code, essayez ceci

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

Si la case est cochée, xelle sera vraie sinon elle sera fausse.

en javascript simple:

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

Cela ne répond pas directement à la question, mais peut aider les futurs visiteurs.

Si vous voulez qu'une variable soit toujours l'état actuel de la case à cocher (plutôt que de devoir continuer à vérifier son état), vous pouvez modifier l' onchangeévénement pour définir cette variable.

Cela peut être fait dans le HTML:

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

ou avec JavaScript:

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

Utilisez ceci:

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

Cela suppose que les cases à cocher ont la classe «messageCheckbox», sinon vous devrez vérifier si l'entrée est du type case à cocher, etc.

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

Si vous utilisez Semantic UI React , dataest passé comme deuxième paramètre de l' onChangeévénement.

Vous pouvez donc accéder à la checkedpropriété comme suit:

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

Rien de ce qui précède n'a fonctionné pour moi sans lancer d'erreurs dans la console lorsque la case n'était pas cochée, j'ai donc fait quelque chose de ce genre à la place (onclick et la fonction de case à cocher ne sont utilisées qu'à des fins de démonstration, dans mon cas d'utilisation, cela fait partie d'un fonction de soumission de formulaire beaucoup plus 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>

Dans mon projet, j'utilise généralement ces extraits:

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

Et ça marche bien. Sincères salutations.