jQuery如何限定复选框联动仅在EachCategorySet类分组div内生效

现有联动失效的核心原因是选择器没有做作用域限制：全局类选择器$('.child1')、$('.child2')会选中整站所有匹配类名的元素，完全没有锚定交互所属的.EachCategorySet分组边界，最终导致跨组误触发联动。

所有联动操作的目标匹配，都要从当前触发交互的复选框元素出发，向上定位到它所属的最近.EachCategorySet父容器，再在容器内部查找需要同步状态的目标元素，从根源上切断跨组匹配的路径。

// parent复选框联动逻辑
$(".parent").change(function () {
  // 定位当前parent所属的EachCategorySet分组
  const currentGroup = $(this).closest('.EachCategorySet');
  // 仅在当前分组范围内同步所有child1、child2的勾选状态
  currentGroup.find('.child1').prop("checked", this.checked);
  currentGroup.find('.child2').prop("checked", this.checked);
});

// child1复选框联动逻辑
$(".child1").change(function () {
  // 定位当前child1所属的EachCategorySet分组
  const currentGroup = $(this).closest('.EachCategorySet');
  // 仅在当前分组范围内同步child2的勾选状态
  currentGroup.find('.child2').prop("checked", this.checked);
});

• 不要直接使用全局类选择器查找联动目标，必须通过$(交互触发元素).closest('.EachCategorySet')锁死专属分组范围
• 调用分组DOM实例的find()方法做内部元素查找，匹配范围严格限制在当前分组的DOM子树内，不会触达其他兄弟分组的元素
• 原代码中if (this.checked)的分支判断属于冗余逻辑：不管当前复选框是勾选还是取消勾选，都需要把同组目标元素的状态同步为当前触发元素的状态，单独做分支判断反而会导致取消勾选时无法同步子项状态

内容的提问来源于stack exchange，提问作者John Brk