jQuery, caixas de seleção e .is (“: verificado”)

Quando vinculo uma função a um elemento de caixa de seleção como:

$("#myCheckbox").click( function() {
    alert($(this).is(":checked"));
});

A caixa de seleção muda seu atributo marcado antes que o evento seja disparado, este é o comportamento normal e fornece um resultado inverso.

No entanto, quando eu faço:

$("#myCheckbox").click();

A caixa de seleção altera o atributo marcado após o evento ser acionado.

Minha pergunta é: há uma maneira de acionar o evento de clique do jQuery como um clique normal faria (primeiro cenário)?

PS: Já tentei com trigger('click');

$('#myCheckbox').change(function () {
    if ($(this).prop("checked")) {
        // checked
        return;
    }
    // not checked
});

Nota: Em versões mais antigas do jquery, era normal usar attr. Agora é sugerido usarprop para ler o estado.

Existe uma solução alternativa que funciona no jQuery 1.3.2 e 1.4.2 :

$("#myCheckbox").change( function() {
    alert($(this).is(":checked"));
});

//Trigger by:
$("#myCheckbox").trigger('click').trigger('change');​​​​​​​​​​​​​

Mas eu concordo, esse comportamento parece bugado em comparação com o evento nativo.

Em junho de 2016 (usando jquery 2.1.4) nenhuma das outras soluções sugeridas funcionou. Verificar attr('checked')sempre retorna undefinede is('checked)sempre retorna false.

Basta usar o método prop:

$("#checkbox").change(function(e) {

  if ($(this).prop('checked')){
    console.log('checked');
  }
});

Ainda estou tendo esse comportamento com o jQuery 1.7.2. Uma solução alternativa simples é adiar a execução do manipulador de cliques com setTimeout e deixar o navegador fazer sua mágica enquanto isso:

$("#myCheckbox").click( function() {
    var that = this;
    setTimeout(function(){
        alert($(that).is(":checked"));
    });
});

Se você antecipar esse comportamento bastante indesejado, uma alternativa seria passar um parâmetro extra de jQuery.trigger () para o manipulador de cliques da caixa de seleção. Este parâmetro extra é para notificar o manipulador de cliques que o clique foi disparado programaticamente, em vez de o usuário clicar diretamente na própria caixa de seleção. O manipulador de cliques da caixa de seleção pode então inverter o status de verificação relatado.

Então, aqui está como eu acionaria o evento de clique em uma caixa de seleção com o ID "myCheckBox". Observe que também estou passando um parâmetro de objeto com um único membro, nonUI, que está definido como verdadeiro:

$("#myCheckbox").trigger('click', {nonUI : true})

E é assim que eu lido com isso no manipulador de eventos de clique da caixa de seleção. A função de manipulador verifica a presença do objeto não-UI como seu segundo parâmetro. (O primeiro parâmetro é sempre o próprio evento.) Se o parâmetro estiver presente e definido como verdadeiro, eu inverto o status .checked relatado. Se esse parâmetro não for passado - o que não acontecerá se o usuário simplesmente clicar na caixa de seleção na IU - eu relato o status real .checked:

$("#myCheckbox").click(function(e, parameters) {
   var nonUI = false;
        try {
            nonUI = parameters.nonUI;
        } catch (e) {}
        var checked = nonUI ? !this.checked : this.checked;
        alert('Checked = ' + checked);
    });

Versão JSFiddle em http://jsfiddle.net/BrownieBoy/h5mDZ/

Eu testei com Chrome, Firefox e IE 8.

<input id="widget-wpb_widget-3-custom_date" class="mycheck" type="checkbox" value="d/M/y" name="widget-wpb_widget[3][custom_date]" unchecked="true">    

var atrib = $('.mycheck').attr("unchecked",true);
$('.mycheck').click(function(){
if ($(this).is(":checked")) 
{
$('.mycheck').attr("unchecked",false);
   alert("checkbox checked");
}
else
{
$('.mycheck').attr("unchecked",true);
 alert("checkbox unchecked");
}
});

  $("#checkbox").change(function(e) {

  if ($(this).prop('checked')){
    console.log('checked');
  }
});

$("#personal").click(function() {
      if ($(this).is(":checked")) {
            alert('Personal');
        /* var validator = $("#register_france").validate(); 
        validator.resetForm(); */
      }
            }
            );

JSFIDDLE

Bem, para combinar com o primeiro cenário, isso é algo que eu inventei.

http://jsbin.com/uwupa/edit

Essencialmente, em vez de vincular o evento "click", você vincula o evento "change" ao alerta.

Então, quando você dispara o evento, primeiro você dispara o clique e, a seguir, a mudança.

Além da resposta de Nick Craver, para que isso funcione corretamente, IE 8você precisa adicionar um manipulador de cliques adicional à caixa de seleção:

// needed for IE 8 compatibility
if ($.browser.msie)
    $("#myCheckbox").click(function() { $(this).trigger('change'); });

$("#myCheckbox").change( function() {
    alert($(this).is(":checked"));
});

//Trigger by:
$("#myCheckbox").trigger('click').trigger('change');

Caso contrário, o callback só será acionado quando a caixa de seleção perder o foco, pois IE 8mantém o foco nas caixas de seleção e rádios quando clicados.

_{Ainda não testei IE 9.}

$( "#checkbox" ).change(function() {
    if($(this).is(":checked")){
        alert('hi');
    }

});

Maneira mais rápida e fácil :

$('#myCheckbox').change(function(){
    alert(this.checked);
});

$el[0].checked;

$ el - é o elemento jquery de seleção.

Aproveitar!

if ($.browser.msie) {
    $("#myCheckbox").click(function() { $(this).trigger('change'); });
}

$("#myCheckbox").change(function() {
        alert($(this).is(":checked"));
    });