JavaScript以检查是否在一个HTML形式被选择的多个无线电输入中的任何一个

Question

我创建与认购倍数出版物（电子邮件）/退订选项的HTML表单。而且需要一个脚本，如果无线电选择与否，将检查。我已经无法创建所需的逻辑。感谢您的贡献。

这个想法是，一个），如果有人选择“退订”接着第一个名字，电子邮件字段将显示为此，B）如果被选中，那么最后的名字“订阅”，国家也将显示用于这一目的。而如果两个退订和订阅选择然后b）适用。因此，它可以订阅到一个出版物，并以相同的形式取消，从另一个。

看来，对于JavaScript的更主要的是，检查一个或多个选择“订阅”，然后做一些事情，或者如果只有“退订”被选中，然后去做别的事情。

下面是我的测试形式，以获得基本思想工作。

    function test(){
    	var checked=false;
    	var elements = document.getElementsByClassName("select");
    	
    	for(var i=0; i < elements.length; i++){
    		if (elements[i].checked) {
    			checked = true;
    			alert("Checked");
    			console.log("checked", true);
    		}
    	}
    	
    	if (!checked) {
    		alert("Unchecked");
    		console.log("unchecked", true);
    	}
    	return checked;
    }

    <form>
    Set 1 <br>
      <input class="select" type="radio" name="A" id="subscribe1"> subscribe 1 <br>
      <input class="select" type="radio" name="A" id="unsubscribe1"> unsubscribe 1 <br>
      <hr>
    Set 2 <br>
      <input class="select" type="radio" name="B" id="subscribe2"> subscribe 2 <br>
      <input class="select" type="radio" name="B" id="unsubscribe2"> unsubscribe 2 <br>
        <hr>
      <input type="reset" value="Reset">
      <button type="button" onClick="test();">Run Test </button>
    </form>

Answer 1

这应该做的伎俩。使用if/else结构来确定每个无线状态：

function test() {
  var checked = false;
  var elements = document.getElementsByClassName("select");

  for (var i = 0; i < elements.length; i++) {
    if (elements[i].checked) {
      checked = true;
      alert(elements[i].id + " Checked");
      console.log(elements[i].id, "checked", true);
    } else {
      alert(elements[i].id + " Unchecked");
      console.log(elements[i].id, "unchecked", true);
    }
  }
  return checked;
}

<form>
  Set 1 <br>
  <input class="select" type="radio" name="A" id="subscribe1"> subscribe 1 <br>
  <input class="select" type="radio" name="A" id="unsubscribe1"> unsubscribe 1 <br>
  <hr> Set 2 <br>
  <input class="select" type="radio" name="B" id="subscribe2"> subscribe 2 <br>
  <input class="select" type="radio" name="B" id="unsubscribe2"> unsubscribe 2 <br>
  <hr>
  <input type="reset" value="Reset">
  <button type="button" onClick="test();">Run Test </button>
</form>