JQuery - 如果使用 JQuery 检查复选框更改事件不会触发
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16892382/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery - Checkbox on-change event doesn't fire if checked using JQuery
提问by hrsetyono
I have this Check Allfunction which check all check boxes. I use JQuery to do that.
我有这个Check All功能可以检查所有复选框。我使用 JQuery 来做到这一点。
But I also have this on changefunction that toggle a class to the wrapper div:
但我也有这个on change函数可以将一个类切换到包装器 div：
$('input[type="checkbox"]').on('change', function(){
$(this).closest('div').toggleClass('highlight');
});
That function runs when I click the Checkbox, but not if I click Check all.
该函数在我单击复选框时运行，但在单击时不运行Check all。
Is there any way to manually fire an event using JQuery? Or is there better solution?
有没有办法使用 JQuery 手动触发事件？或者有更好的解决方案吗？
Thanks
谢谢
EDIT:
编辑：
Here's the simplified HTML:
这是简化的 HTML：
<a id="check_all">Check All</a>
<div>
<input type="checkbox" name="cb" value="abc">ABC<br>
</div>
<div>
<input type="checkbox" name="cb" value="pqr">PQR<br>
</div>
<div>
<input type="checkbox" name="cb" value="xyz">XYZ<br>
</div>
Here's the JSFiddle
这是 JSFiddle
回答by visnu
After click check all you should call change() event like this
单击检查后，您应该像这样调用 change() 事件
$(document).ready(function(){
$("input[type='checkbox']").on('change', function(){
$(this).closest('div').toggleClass('highlight');
});
$("#check_all").on('click', function(){
$("input[type='checkbox']").prop('checked', true).change();
});
});
回答by woutr_be
This will trigger the changeevent, but only after you bind it first.
这将触发change事件，但前提是您先绑定它。
$('input[type="checkbox]').trigger('change');
回答by Farhan
You can try this,
你可以试试这个
$(document).on('change','input[type="checkbox]' ,function(){
// $this will contain a reference to the checkbox
var $this = $(this);
if ($this.is(':checked')){//To CHECK CHECK BOX IS CHECKED OR NOT
$(this).closest('div').toggleClass('highlight');
}
});
Hope It Helps,
希望能帮助到你，
回答by Andrew
Almost identical to visnu's answer, but directly calling click() will fire all the click events bound by jQuery. If you demo this, you will see it also unchecks the boxes, whereas his answer simply removes the highlight while they remain clicked.
几乎与 visnu 的答案相同，但直接调用 click() 将触发 jQuery 绑定的所有点击事件。如果你演示这个，你会看到它也取消选中这些框，而他的回答只是在它们保持点击时删除了突出显示。
$(document).ready(function(){
$("input[type='checkbox']").on('change', function(){
$(this).closest('div').toggleClass('highlight');
});
$("#check_all").on('click', function(){
$("input[type='checkbox']").click();
});
});
回答by Seo
Check this fiddle modification of your code: http://jsfiddle.net/d4VTh/51/
检查您的代码的这个小提琴修改：http: //jsfiddle.net/d4VTh/51/
$(document).ready(function(){
$("input[type='checkbox']").on('change', function(){
if (this.checked)
$(this).closest('div').addClass('highlight');
else
$(this).closest('div').removeClass('highlight');
});
$("#check_all").on('click', function(){
var item = $("input[type='checkbox']")
item.prop('checked', !item.prop('checked')).change();
});
});
