Javascript 传递到输入字段的复选框在jquery中存在冲突

我正在尝试在距离它最近的字段中添加

复选框的值。但我想我错过了什么。请参阅下面我的代码：


$（文档）.ready（函数（）{
$（“输入：复选框”）。单击（函数（）{
var输出=”；
$（“输入：选中”）。每个（函数（）{
输出+=$（this）.val（）+“，”；
});
$（this）.closest（'.divs'）.find（“.result”）.val（output.trim（））；
});
});



1

2

3.





1

2

3.
第一个问题是您有多个具有相同Id的元素，请为此使用类

第二，使用
$（“输入：选中”）。每个
获取所有选中的输入，但使用
（“输入：选中”）。每个
获取当前
div.div中的所有输入


$（文档）.ready（函数（）{
$（“输入：复选框”）。单击（函数（）{
var输出=”；
var length=$（this）.parent（'.divs'）.find（“输入：选中”）.length；
$（this）.parent（'.divs'）.find（“输入：选中”）.each（函数（索引）{
输出+=$（this.val（）+（索引！==（长度-1）？，“：”；
});
$（this.parent（'.divs'）.find（“.field_results”）.val（output.trim（））；
});
});



1

2

3.





1

2

3.
将
输入类型文本
attr更改为
classname
，而不是
id
。通过父div将复选框值设置为目标

更新1

使用
，
取消调用
map（）
函数

升级2

加上空值


$（文档）.ready（函数（）{
$（“输入：复选框”）.change（函数（）{
var output=$（this）.closest（'.divs'）.find（“input:checked”）.map（函数（）{
返回$（this.val（）；
}).get（）；
var res=output.length==0？'empty'：output.join（'，'）；
$（this）.closest（'.divs'）.find（“.field_results”）.val（res）；
});
});



1

2

3.





1

2

3.
您可以看到希望它会有帮助我不想在结尾处添加额外的空间，请将空间更新为
，
检查我的更新答案。我添加了占位符。它将显示框为空。我想使用
值
属性而不是占位符确定。让我们检查更新的答案。我用
change
更改函数，而不是
单击
@Jonjie updateedit的工作，
parent（）
对我不起作用。但是它是基于您的示例工作的。如果您的html与我的html相同，那么Parent应该工作，否则请使用
.nestest（）