表单中带有JavaScript的单选按钮

表单中带有JavaScript的单选按钮,javascript,html,forms,validation,Javascript,Html,Forms,Validation,我有这个JavaScript代码,我正在使用它进行表单验证,我正在尝试将两个单选按钮放入其中,并让它们以与表单其余部分相同的方式进行验证,但我无法让它工作。我的按钮html是: <label class="required" for="buttons">How May I Contact You:</label><br/> <input id="radio" type="radio0" name="contact" value="email"&g

我有这个JavaScript代码,我正在使用它进行表单验证,我正在尝试将两个单选按钮放入其中,并让它们以与表单其余部分相同的方式进行验证,但我无法让它工作。我的按钮html是:

<label class="required" for="buttons">How May I Contact You:</label><br/>
    <input id="radio" type="radio0" name="contact" value="email">Email<br>
    <input id="radio" type="radio1" name="contact" value="no contact">No Contact<br>
    <span id="radio_validation" class="error"></span>
    <input type="submit" value="Send email" onclick="validate()" value="Check"/>

仅供参考的ID必须是唯一的。我也看不出你在哪里尝试验证你的单选按钮。。实际上,HTML5有很多功能可以帮助验证,比如在输入中设置required和type=email,所以您可能希望检查这一点,而不是编写太多javascript;我把它们弄得乱七八糟,几个小时后才拿出来。很抱歉,我在某一点上更改了它们。很抱歉,我整晚都在做这件事。请将您的代码放在a中。我个人认为单选按钮组应该始终有一个选中的按钮。这样一来,用户就不可能在没有选中按钮的情况下提交表单,除非他们故意破坏自己的表单。
function validateForm() {
  var valid = 1;
  var email = document.getElementById('email');
  var email_validation = document.getElementById("email_validation");
  var name = document.getElementById('name');
  var name_validation = document.getElementById("name_validation");
  var message_validation = document.getElementById("message_validation");
  var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;

  if (name.value === "") {
    valid = 0;
    name_validation.innerHTML = "Field Required";
    name_validation.style.display = "block";
    name_validation.parentNode.style.backgroundColor = "#FFDFDF";
  } else {
    name_validation.style.display = "none";
    name_validation.parentNode.style.backgroundColor = "transparent";

  }

  if (message.value === "") {
    valid = 0;
    message_validation.innerHTML = "Field Required";
    message_validation.style.display = "block";
    message_validation.parentNode.style.backgroundColor = "#FFDFDF";
  } else {
    message_validation.style.display = "none";
    message_validation.parentNode.style.backgroundColor = "transparent";
  }

  if (email.value === "") {
    valid = 0;
    email_validation.innerHTML = "Field Required";
    email_validation.style.display = "block";
    email_validation.parentNode.style.backgroundColor = "#FFDFDF";
  } else {
    email_validation.style.display = "none";
    email_validation.parentNode.style.backgroundColor = "transparent";
  }

  if(!filter.test(email.value)) {
    valid = 0;
    email_validation.innerHTML = "Invalid email address";
    email_validation.style.display = "block";
    email_validation.parentNode.style.backgroundColor = "#FFDFDF";
  } else {
    email_validation.style.display = "none";
    email_validation.parentNode.style.backgroundColor = "transparent";
  }
  if (!valid)
    return false;
}