jQuery，checkbox和.is（“：checked”）

当我将一个函数绑定到checkbox元素，如：

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

在触发事件之前 ，该checkbox将更改其checked属性，这是正常行为，并给出相反的结果。

但是，当我这样做的时候：

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

事件触发后 ，该checkbox会更改它的checked属性。

我的问题是，是否有一种方法来触发从jQuery的点击事件就像一个普通的点击会做（第一个场景）？

PS：我已经试过用trigger('click') ;

Answer 1

我想你应该使用“更改”处理程序：

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

Answer 2

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

 $("#myCheckbox").change( function() { alert($(this).is(":checked")); }); //Trigger by: $("#myCheckbox").trigger('click').trigger('change');​​​​​​​​​​​​​ 

但是我同意，与本机事件相比，这种行为看起来很麻烦。

Answer 3

截至2016年6月（使用jQuery 2.1.4）没有其他build议的解决scheme的工作。 检查attr('checked')总是返回undefined ， is('checked)总是返回false 。

只需使用prop方法：

 $("#checkbox").change(function(e) { if ($(this).prop('checked')){ console.log('checked'); } }); 

Answer 4

我仍然在使用jQuery 1.7.2遇到这种情况。 一个简单的解决方法是推迟使用setTimeout的点击处理程序的执行，并让浏览器在此期间发挥其魔力：

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

Answer 5

如果您预料到这种相当不想要的行为，那么绕过它将是一个额外的参数从jQuery.trigger（）传递到checkbox的点击处理程序。 这个额外的参数是通知点击处理程序点击已经以编程方式触发，而不是由用户直接点击checkbox本身。 checkbox的点击处理程序可以反转报告的检查状态。

所以这里是我如何在ID为“myCheckBox”的checkbox上触发点击事件。 请注意，我也传递一个对象参数与​​单个成员nonUI，它被设置为true：

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

这里是我如何处理checkbox的单击事件处理程序。 处理程序函数检查是否存在nonUI对象作为其第二个参数。 （第一个参数总是事件本身。）如果参数存在并设置为true，则反转报告的.checked状态。 如果没有这样的参数传入 – 如果用户只需点击UI中的checkbox就不会有这个参数 – 那么我会报告实际的.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); }); 

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

我已经testing了Chrome，Firefox和IE 8。

Answer 6

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

Answer 7

  $("#checkbox").change(function(e) { if ($(this).prop('checked')){ console.log('checked'); } }); 

Answer 8

那么，为了匹配第一个场景，这是我想到的。

http://jsbin.com/uwupa/edit

实质上，不是绑定“click”事件，而是将“change”事件与警报绑定。

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

Answer 9

除了Nick Craver的回答，为了在IE 8上正常工作，您需要在checkbox中添加一个额外的点击处理程序：

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

否则，只有当checkbox失去焦点时才会触发callback，因为IE 8在单击时将注意力集中在checkbox和收音机上。

_{虽然没有在IE 9testing过。}

Answer 10

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

Answer 11

最快最简单的方法 ：

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

---

 $el[0].checked; 

$ el – 是jquery的select元素。

请享用！

Answer 12

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