多个复选框 jquery 手动单击复选框会触发，但“代码单击”不会触发答案

【问题标题】：Multiple checkboxes jquery manual clicked checkbox fires, but 'code clicked' one doesn't多个复选框 jquery 手动单击复选框会触发，但“代码单击”不会触发
【发布时间】：2014-07-08 01:17:22
【问题描述】：

我有多个复选框，当所有复选框都被选中时 - 他们会选中一个父复选框。检查该父复选框时，请发出警报，并在...

中淡出图像。

问题是，当使用 jquery 选中父复选框时，它们不会显示警报或交换图像，只有在手动选中复选框时才有效。

这是我的代码： // 父复选框 - 多个复选框

$("input[type='checkbox'].PARENT-CHECKBOXES").change(function(){
    var a = $("input[type='checkbox'].PARENT-CHECKBOXES");
    if(a.length == a.filter(":checked").length){
        alert('ACTION COMPLETED');
        TweenMax.to("#fade-in-image", 0.1, {autoAlpha: 1});
    }
});

// Child Checkboxes -multiple checkboxes

$("input[type='checkbox'].CHILD-CHECKBOX").change(function(){
    var step1 = $("input[type='checkbox'].CHILD-CHECKBOX");
    if(step1.length == step1.filter(":checked").length){
        alert('SKU OPERATION COMPLETE');
        $("#PARENT-CHECKBOX1").prop("checked", true);           
    }
});

编辑：所以我编辑了我的代码，这是工作结果。

var a = $("input[type='checkbox'].PARENT-CHECKBOXES");

$("input[type='checkbox'].CHILD-CHECKBOX").change(function(){
var step2 = $("input[type='checkbox'].CHILD-CHECKBOX");
if(step2.length == step2.filter(":checked").length){
        alert('Operation Complete');
        $("#PARENT-CHECKBOX1").prop("checked", true).change();
    }
if(a.length == a.filter(":checked").length){
    alert('ACTION COMPLETED');
    TweenMax.to("#fade-in-image", 0.1, {autoAlpha: 1});
}
});

【问题讨论】：

您可以在以编程方式选中该框后调用该函数

标签： javascript jquery html checkbox

【解决方案1】：

当您以编程方式选中/取消选中复选框时，它不会自动触发（正如您已经体验过的那样）。您需要使用.trigger() 来触发更改事件。

代码

$("#PARENT-CHECKBOX1").trigger("change");

或

$("#PARENT-CHECKBOX1").change();

【讨论】：

感谢这有效 - 尽管我需要稍微更改我的代码才能工作。我已经编辑了我的帖子

【解决方案2】：

你需要在检查后触发change事件——它不会自动触发——像这样：

$("#PARENT-CHECKBOX1").prop("checked", true).trigger("change");

【讨论】：