Question

我有两组不同的单选按钮需要在提交表单之前进行验证。我可能需要在将来添加更多选项，但目前有两组是/否问题。这是目前为止单选按钮的代码。

<form name=myForm action="test.php" method="post">
<input type="radio" name="question1" id="question1">
<input type="radio" name="question1" id="question1">
<input type="radio" name="question2" id="question2">
<input type="radio" name="question2" id="question2">
<input type="submit" value="Submit">
</form>

因此，在提交表单之前，基本上寻找一种方法来确保在每个组中选择一个选项（问题1和问题2）。

Answer 1

这个问题实际上是两个部分和一个旁注。

旁注（与问题无关）是id应该始终是唯一的，有两个id为“question1”的无线电无效。

问题一是在表单提交上检查它。最简单的方法是在表单的onsubmit标记中添加“return functName（）”。

<form name='myForm' action='test.php' method='post' onsubmit='return validate()'>

表单是否提交将取决于您是否在提交中返回true或false。

第二种是抓住收音机盒并检查它们是否被选中。您可以使用以下方法获取每个无线电接口的输入：

document.forms.myForm.nameOfRadioHere

将为您提供该名称下的输入列表。

然后你只需循环遍历它们，检查其中一个.checked是否有效。

示例代码：

使用Javascript：

function validate(){
  if (checkRadio("question1") && checkRadio("question2")){
    return true;
  }else{
    alert("Please fill in both radio boxes!");
    return false;
  }
}

function checkRadio(name){
  var radio = document.forms.myForm[name];
  for (var option in radio){
    if(radio[option].checked){
      return true;
    }
  }
  return false;
}

HTML 的

<form name='myForm' action="test.php" method="post" onsubmit='return validate()'>
  <input type="radio" name="question1">
  <input type="radio" name="question1">
  <input type="radio" name="question2">
  <input type="radio" name="question2">
  <input type="submit" value="Submit">
</form>

如何验证多组单选按钮？

1 个答案: