2015-02-07 46 views
0

一个div应该只选择一个单选按钮,并且如果一个div选择测试无线电比其他div选择无线电广播。如何使用javascript将html中的单选按钮分组为

<div><label>Test1<input type="radio" value="test" name="test" /></label> 
<label>Training<input type="radio" value="training" name="training" /></label> 
</div><hr /> 
<div> 
<label>Test<input type="radio" value="test" name="test" /></label> 
<label>Training<input type="radio" value="training" name="training" /></label> 
    </div> 

这里是fiddle

+1

的'name'属性是无线电集团,它不应该与价值的文本中使用。 – Kroltan 2015-02-07 12:48:52

+0

只有一个测试和一个训练被选中,如果我选择测试场第一个div比第二个div必须选择训练,反之亦然。 – fruitjs 2015-02-08 03:28:46

+0

你将需要JS。 – Kroltan 2015-02-09 10:45:54

回答

0

难道这就是你要找的人?

var rad = document.myForm1.myRadios; 
 
    var rad2 = document.myForm2.myRadios; 
 

 
    for(var i = 0; i < rad.length; i++) { 
 
     rad[i].onclick = function() { 
 
      if(this.value==1){ 
 
       document.getElementById('f2v2').checked = true; 
 
      } else { 
 
       document.getElementById('f2v1').checked = true; 
 
      } 
 
     } 
 
    } 
 

 
    for(var i = 0; i < rad2.length; i++) { 
 
     rad2[i].onclick = function() { 
 
      if(this.value==1){ 
 
       document.getElementById('f1v2').checked = true; 
 
      } else { 
 
       document.getElementById('f1v1').checked = true; 
 
      } 
 
     } 
 
    }
<form name="myForm1"> 
 
    Testing<input type="radio" name="myRadios" value="1" id="f1v1"/> 
 
    Training<input type="radio" name="myRadios" value="2" id="f1v2"/> 
 
</form> 
 

 
<form name="myForm2"> 
 
    Testing<input type="radio" name="myRadios" value="1" id="f2v1"/> 
 
    Training<input type="radio" name="myRadios" value="2" id="f2v2"/> 
 
</form>