java前端全选时会将复选框所有的选中项重复四遍？

Question

点击全选时，会出现重复四遍被选中的值


全选的代码


下面被选中的代码

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

在JavaScript和jQuery中，当你对一个元素的所有子元素进行选择并执行操作时，你可能会遇到类似的问题。这通常是因为你的代码没有正确地处理DOM结构的变化。

为了修复这个问题，你可以使用each()方法来迭代所有子元素，并确保每次迭代后都重新设置this。这样可以避免循环引用的问题。

以下是一个例子：

function allSelect() {
  $(".check_" + ind).prop('checked', $("#check_" + ind).is(':checked'));
}

在这个例子中，我们首先为每个<input>标签添加类名check_，然后通过ind变量获取当前要操作的<input>的索引。然后，我们在allSelect函数中创建了一个新的<input>元素，它具有相同的属性（即id），但是其类名为check_加上当前索引的字符串（例如check_1）。

当用户单击某个选项时，allSelect函数会被调用，它会检查对应的<input>是否已经被选中。如果未被选中，则将其设置为已选中；如果已被选中，则将其取消选中。

注意：这个解决方案依赖于你已经在页面上设置了这些元素。如果你还没有这样做，请先设置好再运行这段代码。