javascript - 复选框根据表单 ID 选择全部

Question

function toggle(source) {
  checkboxes = document.getElementsByName("foo");
  for(var i=0; i < checkboxes.length; i++) {
    checkboxes[i].checked = source.checked;
  }
}

<form id="one">  
    <fieldset>  
    <legend>Select Quarter / 2017</legend> 
    <input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
    <input type="checkbox" name="foo" >Q1 2017<br>  
    <input type="checkbox" name="foo" >Q2 2017<br>  
    <input type="checkbox" name="foo" >Q3 2017<br> 
    <input type="checkbox" name="foo" >Q4 2017<br>   
    </fieldset>
</form>  

<form id="two">  
    <fieldset>  
    <legend>Select Quarter / 2017</legend> 
    <input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
    <input type="checkbox" name="foo" >Q1 2017<br>  
    <input type="checkbox" name="foo" >Q2 2017<br>  
    <input type="checkbox" name="foo" >Q3 2017<br> 
    <input type="checkbox" name="foo" >Q4 2017<br>   
    </fieldset>
</form>  

<form id="three">  
    <fieldset>  
    <legend>Select Quarter / 2017</legend> 
    <input type="checkbox" name="foo" onClick="toggle(this)" />All<br/>
    <input type="checkbox" name="foo" >Q1 2017<br>  
    <input type="checkbox" name="foo" >Q2 2017<br>  
    <input type="checkbox" name="foo" >Q3 2017<br> 
    <input type="checkbox" name="foo" >Q4 2017<br>   
    </fieldset>
</form>

我想使用相同的javascript函数来根据ID定位三个不同的选择所有表单。通过此功能，我现在可以切换所有复选框，但我想切换每个表单中的所有复选框，因此我不会同时切换所有三种表单中的所有复选框。我怎样才能做到这一点？

Answer 1

请更新以下 JavaScript 函数，它将获得选定的特定表单复选框

function toggle(source) {
      var parent_form = source.parentElement.parentNode;      
      var checkboxes = parent_form.getElementsByTagName('input');
      for(var i=0; i < checkboxes.length; i++) {
        checkboxes[i].checked = source.checked;
      }
}

这取决于 ID 的形式。