jQuery，复选框和.is（“：checked”）

当我将函数绑定到复选框元素时，例如：

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

复选框在事件触发之前更改其选中属性，这是正常现象，并给出相反的结果。

但是，当我这样做时：

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

触发事件后，复选框会更改其选中属性。

我的问题是，有没有办法像正常点击一样触发jQuery的click事件（第一种情况）？

PS：我已经尝试过了trigger('click')；

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

注意：在旧版本的jquery中，可以使用attr。现在建议使用prop读取状态。

在jQuery 1.3.2和1.4.2中有一种解决方法：

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

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

但我同意，与本地事件相比，此行为似乎有错误。

截至2016年6月（使用jquery 2.1.4），其他建议解决方案均无效。检查attr('checked')总是返回undefined并且is('checked)总是返回false。

只需使用prop方法：

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

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

我仍在使用jQuery 1.7.2遇到这种行为。一个简单的解决方法是使用setTimeout推迟单击处理程序的执行，并让浏览器同时执行以下操作：

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

如果您预料到这种相当有害的行为，那么可以避免的是将jQuery.trigger（）的额外参数传递给复选框的单击处理程序。这个额外的参数用于通知点击处理程序，该点击是通过编程方式触发的，而不是由用户直接单击复选框本身来触发的。然后，复选框的单击处理程序可以反转报告的检查状态。

因此，这就是在ID为“ myCheckBox”的复选框上触发点击事件的方式。请注意，我还传递了带有单个成员nonUI的对象参数，该成员参数设置为true：

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

这就是我在复选框的click事件处理程序中处理该事件的方式。处理程序功能将检查nonUI对象是否存在作为其第二个参数。（第一个参数始终是事件本身。）如果该参数存在并设置为true，那么我将反转报告的.checked状态。如果没有传入这样的参数-如果用户只是简单地单击UI中的复选框，就不会有此参数-然后我报告实际的.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);
    });

http://jsfiddle.net/BrownieBoy/h5mDZ/上的 JSFiddle版本

我已经测试过Chrome，Firefox和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

好吧，为了匹配第一种情况，这是我想出的。

http://jsbin.com/uwupa/edit

本质上，您不是将“ click”事件绑定到警报中，而是将“ change”事件绑定到了警报中。

然后，当您触发事件时，首先触发点击，然后触发更改。

除了尼克·克雷弗（Nick Craver）的答案之外，要使其正常工作，IE 8您还需要在复选框中添加其他点击处理程序：

// 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');

否则，仅当复选框失去焦点时才触发回调。 IE 8单击复选框和单选按钮时，它们会一直保持焦点。

_{还没有测试IE 9。}

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

});

最快，最简单的方法：

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

$el[0].checked;

$ el-是选择的jquery元素。

请享用！

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

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