如何检查收音机也选择组中的其他字段？

我有一个很长的forms与字段组。 当选择一个无线电场时，我还需要它在同一个div中选择几个“隐藏”字段并在提交时传递这些值。 如果选择了另一个无线电，则需要清除这些隐藏的字段，而选择其他组。

示例1 – 选择Radio 1，选择相同div / fieldset中的所有隐藏字段：

A组：
收音机1（已选中）
隐藏场1a（已选中）
隐藏字段1b（已选中）
隐藏场1c（已选中）

B组：
电台2
隐藏场2a
隐藏的场2b
隐藏的场2c

示例2 – 选择无线电2，其选择相同div / fieldset中的所有隐藏字段，取消选择所有无线电1字段：

A组：
电台1
隐藏的领域1a
隐藏的领域1b
隐藏的领域1c

B组：
收音机2（已选中）
隐藏场2a（已选中）
隐藏字段2b（已选中）
隐藏场2c（已选中）

视觉示例：

示例HTML：

 
Item 1
 
 
 Item 1, Options Set A Label  
    
 
 
 Item 1, Options Set B Label  
    
 
 
 
Item 2
 
 
 Item 2, Options Set A Label  
    
 
 
 Item 2, Options Set B Label  
    
  

我也可以将它们分组到一个字段集或其他元素中，但我只需要选择的无线电来选择同一组中的其余表单字段。 此外，组和字段是动态添加的，所以我希望有一个“全部捕获”类型的function……

我怎么能这样做？

Answer 1

检查无线电元素的change事件，并将检查委托给document以便它可以使用动态元素。

 $(document).on('change', '.checkbox-wrapper input[type="radio"]', function() { $(this) .closest('.item') .find('.checkbox-wrapper') .each(function() { var checkboxes = $(this).siblings('input[type="checkbox"]'), radio = $('input[type="radio"]', this).get(0); checkboxes.prop('checked', radio.checked); }); }); 

  
 
Item 1
 
 
 Item 1, Options Set A Label  
    
 
 
 Item 1, Options Set B Label  
    
 
 
 
Item 2
 
 
 Item 2, Options Set A Label  
    
 
 
 Item 2, Options Set B Label