Conseguiste o valor da opção assinalada?

Então tenho um código parecido com este:
<input class="messageCheckbox" type="checkbox" value="3" name="mailId[]">
<input class="messageCheckbox" type="checkbox" value="1" name="mailId[]">
Só preciso do Javascript para obter o valor da opção que está assinalada.

editar : para adicionar, só haverá uma opção assinalada.

Author: Richard Barker, 2012-07-22

9 answers

para navegadores modernos:

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

usando jQuery:

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

javascript puro Sem 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;
      }
}
 187
Author: Engineer, 2014-06-26 10:49:49

Nenhuma das coisas acima funcionou para mim, mas basta usar isto:

document.querySelector('.messageCheckbox').checked;
Codificação feliz.
 191
Author: JanBorup, 2017-11-08 19:25:31
Estou a usar isto no meu código.Tenta isto.
var x=$("#checkbox").is(":checked");

Se a opção estiver assinalada x será verdadeiro caso contrário será falso.

 96
Author: user1683014, 2013-09-02 13:21:56

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);
    }
}
 9
Author: Stano, 2012-07-22 11:10:19

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


Se quiser ter uma variável seja sempre o estado actual da opção (em vez de ter de continuar a verificar o seu estado), poderá modificar o evento onchange para definir essa variável.

Isto 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})
 3
Author: Joe Iddon, 2018-04-08 08:52:21

Usa isto:

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

Isto assume que as opções para verificar têm a classe "messageCheckbox", caso contrário teria de fazer uma verificação se a entrada é o tipo de opção, etc.

 2
Author: jackJoe, 2012-07-22 10:57:42

$(document).ready(function() {
  var ckbox = $("input[name='ips']");
  var chkId = '';
  $('input').on('click', function() {
    
    if (ckbox.is(':checked')) {
      $("input[name='ips']:checked").each ( function() {
   			chkId = $(this).val() + ",";
        chkId = chkId.slice(0, -1);
 	  });
       
       alert ( $(this).val() ); // return all values of checkboxes checked
       alert(chkId); // return value of checkbox checked
    }     
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<input type="checkbox" name="ips" value="12520">
<input type="checkbox" name="ips" value="12521">
<input type="checkbox" name="ips" value="12522">
 2
Author: Marinha do Nascimento, 2016-08-10 15:16:59

Se estiver a utilizar reacção de UI semântica, data é passado como segundo parâmetro para o evento onChange.

Pode, portanto, aceder à propriedade checked do seguinte modo:

<Checkbox label="Conference" onChange={(e, d) => console.log(d.checked)} />
 0
Author: Dave Clark, 2018-04-19 14:11:52

No meu projecto, costumo usar estes excertos:

var type[];
$("input[name='messageCheckbox']:checked").each(function (i) {
                type[i] = $(this).val();
            });
E funciona bem. Cumprimento.
 -3
Author: VanThaoNguyen, 2016-08-03 02:18:27