【问题标题】：Picking up Changed Checkbox from Programmatic Check/Uncheck从 Programmatic Check/Uncheck 中选择 Changed Checkbox
【发布时间】：2016-11-25 08:47:54
【问题描述】：

给定：

HTML

<input id='a' value='bbb' type='checkbox'>
<button id='btn'>
click to change checkbox
</button>

咖啡脚本

$('#a').change ->
    console.log 'asdfasdf'

$('#btn').click ->
    document.getElementById('a').checked=true
    document.getElementById('a').checked=false
    document.getElementById('a').checked=true

当我第一次按下按钮时，我预计会看到 3 条控制台输出日志消息。但我没有看到。

当我的复选框的checked 状态发生变化时，如何修改我的on change 函数以记录消息？

【问题讨论】：

标签： javascript jquery html coffeescript

【解决方案1】：

因为以编程方式更改值或属性不会触发用户事件，如果您需要触发事件，则需要自己进行

$('#btn').click ->
    var $a = $('#a')
    for(var i=0; i<3; i++){
         setTimeout(function(){
            $a.prop('checked', !$a[0].checked).change();
         },i*500)
   }

【讨论】：

【解决方案2】：

您可以通过以下两种方式之一进行操作。

如果您只想切换复选框，则可以触发对复选框的单击，而不是将其显式设置为 true 或 false。

$('#btn').click ->
    $('#a').click()

或者您可以在设置选中的属性后触发更改。

$('#btn').click ->
    $('#a').prop('checked', true).change()

在 javascript 中设置选中的值不会自动触发更改处理程序（与使用 .val() 设置输入值的相同方式不会触发更改处理程序）

【讨论】：

【解决方案3】：

我希望这是你的要求

按钮点击功能

$('#btn').click(function(){
 var isChecked  = $('#a').is(":checked");
 if (isChecked) {
                console.log("CheckBox checked.");
            } else {
                console.log("CheckBox not checked.");
            }

});

复选框更改功能

$('#a').change(function(){
 var isChecked  = $(this).is(":checked");
 if (isChecked) {
                console.log("CheckBox checked.");
            } else {
                console.log("CheckBox not checked.");
            }

});

【讨论】：