Javascript 显示时，添加复选框值不适用于隐藏的'div'

我试图在选中时对复选框值求和，并将其显示在另一个输入字段上

下面给出的脚本运行良好。但是当使用

.show（）显示时，使用
display:none
CSS的隐藏
div
无法工作


函数显示复选框（）{
$（'.checkbox'）.show（）；
}
$（文档）.ready（函数（）{
函数计算（）{
var总和=0；
$（“.add:checked”）.each（函数（i，n）{sum+=parseInt（$（n.val（））；}）
$（“#sum”）.val（sum）；
}
$（“.add”）。更改（计算）；
计算（）；
})
。复选框{
显示：无；
边缘顶部：20px；
}

显示复选框
复选框1


复选框2


复选框3
如果您希望在显示复选框时自动选中复选框，请在显示功能中添加以下内容：

.trigger（）
方法允许您以编程方式触发事件（无需用户手动输入）。BTW id不能重复，它们必须是唯一的，因此将三个
更改为


$（'button'）。在（'click'，showC'）；
美元（“.add”）。在（'change'，calcC）；
函数showC（）{
$（'.checkbox'）.show（）；
$（'.add'）.trigger（'click'）；
}
函数calcC（）{
var总和=0；
$（'.add:checked'）。每个（函数（）{
sum+=parseInt（$（this）.val（），10）；
});
$（“#sum”）.val（sum）；
}
。复选框{
显示：无；
边缘顶部：20px；
}

显示复选框
复选框1


复选框2


复选框3
这里有一个输入错误：
$（“添加”）.change（计算）
，应该是
。add
，而不是
add
@extemp谢谢你删除了打字错误，但问题仍然存在。隐藏时它不起作用是什么意思？隐藏时没有选中复选框，因此总和为0。如果函数不执行，它将是空字符串值。如果您将
checked=“true”
添加到一些复选框中，那么它将首先被选中，在
Calculate
调用后，您将在输入中得到相应的和结果。@extemp不能处理隐藏的div，我将使用
show（）
方法打开它。谢谢，你的答案很完美。请看看这也是为什么它不能使用这种方法的原因。不知道它应该如何工作，或者期望得到什么，或者它是否使用新代码工作。
$('.add').trigger('click');