Obter o valor da caixa de seleção marcada?

Então, eu tenho um código que se parece com isso:

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

Eu só preciso de Javascript para obter o valor de qualquer caixa de seleção atualmente marcada.

EDIT : Para adicionar, haverá apenas uma caixa de seleção.

Para navegadores modernos :

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

UsandojQuery :

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

Javascript puro semjQuery :

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

Nenhuma das opções acima funcionou para mim, mas simplesmente use isso:

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

Feliz codificação.

Estou usando isso no meu código.Tente isso

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

Se a caixa de seleção estiver marcada x, será verdadeira, caso contrário, será falsa.

em javascript simples:

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

Isso não responde diretamente à pergunta, mas pode ajudar futuros visitantes.

Se você deseja que uma variável sempre seja o estado atual da caixa de seleção (em vez de precisar continuar verificando seu estado), você pode modificar o onchangeevento para definir essa variável.

Isso pode ser feito no HTML:

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

ou com JavaScript:

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

Usa isto:

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

Isso pressupõe que as caixas de seleção estejam com a classe "messageCheckbox"; caso contrário, você teria que verificar se a entrada é do tipo caixa de seleção, 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);
}

Se você estiver usando o Semantic UI React , dataserá passado como o segundo parâmetro para o onChangeevento.

Portanto, você pode acessar a checkedpropriedade da seguinte maneira:

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

Nenhuma das opções acima funcionou para mim sem lançar erros no console quando a caixa não estava marcada, então eu fiz algo nesse sentido (onclick e a função checkbox estão sendo usadas apenas para fins de demonstração, no meu caso de uso faz parte de um função de envio de formulário muito maior):

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>

No meu projeto, eu geralmente uso esses trechos:

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

E isso funciona bem. Os meus cumprimentos.