1

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

<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)中选择了一个选项。

4

1 回答 1

1

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

旁注(与问题无关)是 id 应该始终是唯一的,拥有两个 id 为“question1”的收音机是无效的。

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

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

表单是否提交将取决于您在提交时返回的是 true 还是 false。

第二个是抓住单选框并检查它们是否被选中。您可以使用以下方法获取每个收音机 seelct 的输入:

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>
于 2012-11-23T11:55:59.420 回答