如果使用JQuery进行检查，JQuery - Checkbox on-change事件不会触发

问题描述

我有这个检查所有复选框的全选函数。我使用JQuery来做到这一点。

但是我也有更改函数来切换一个类到包装器div：

  $（'input [type =checkbox]'）。on（'change'，function（）{ 
 $（this）.closest（'div'）。toggleClass（'highlight'）; 
}）; 
  

当我点击复选框时，该函数运行，但如果点击所有。

有没有办法用JQuery手动触发一个事件？还是有更好的解决方案？

谢谢

下面是简化的HTML：

 < a id =check_all>全部检查< / a> 
< div> 
< input type =checkboxname =cbvalue =abc> ABC< br> 
< / div> 
< div> 
< input type =checkboxname =cbvalue =pqr> PQR< br> 
< / div> 
< div> 
< input type =checkboxname =cbvalue =xyz> XYZ< br> 
< / div> 
  

这里是JSFiddle

解决方案

点击后，您应该调用change（）事件像这样

pre $ $（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（）;
}）;
}）;


I have this Check All function which check all check boxes. I use JQuery to do that.

But I also have this on change function that toggle a class to the wrapper 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.

Is there any way to manually fire an event using JQuery? Or is there better solution?

Thanks

EDIT:

Here's the simplified 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

http://jsfiddle.net/DarcFiddle/d4VTh/

解决方案

After click check all you should call change() event like this

$(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();
    });
});

这篇关于如果使用JQuery进行检查，JQuery - Checkbox on-change事件不会触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！