验证单选按钮组

时间:2013-09-18 06:36:12

标签: javascript validation

function validate()
{
      var a = document.getElementById("a");
      var b = document.getElementById("b");
      var valid = true;


 if(a.value.length<=0 || b.value.length<=0 || a.value.trim()=="" || b.value.trim()=="")
       {
              alert("Don't leave the field empty!");
              valid = false;
       }

   if(isNaN(a.value) || isNaN(b.value))
    {
            alert("Enter a proper number!");
            valid = false;
    }

   for(var i=0; i<form.elements.length; i++)
   {
       if(form.elements[i].checked)
       {
                 valid = true;
       }
       else
       {
           alert("No option selected!");
           valid = false;
       }
    }
         return valid;
 };

这是我的JavaScript函数,用于验证单选按钮组以检查是否至少选择了其中一个。而且,下面的是我的表格。

<form name="myForm" font-size="75px;" action ="serv" method="get" onsubmit="return validate();" >
        <hr/>
        Enter the 1st number: <input type="text" name="a" id="a" /><br/>
        Enter the 2st number: <input type="text" name="b" id="b"/><br/><br/>
        <label>Add</label><input type="radio" name="option" value="Add" id="r1" /><br/>
        <label>Subtract</label><input type="radio" name="option" value="Subtract" id="r2" /><br/>
        <label>Multiply</label><input type="radio" name="option" value="Multiply" id="r3" /><br/>
        <label>Divide</label><input type="radio" name="option" value="Divide" id="r4" /><br/>
        <input type="submit" value="Submit" />


</form>

当我输入并且没有选择单选按钮时,它应该提醒用户,但它没有发生。有人可以指导我出错的地方吗?并帮我解决这个问题?我知道可能有很多重复,但我已经尝试过它们都无济于事。当我单击提交而不选择单选按钮时,它会给我一个空白页面。任何帮助表示赞赏。感谢。

1 个答案:

答案 0 :(得分:2)

试试这个,点击这里的演示Fiddle

function validate()
{
      var a = document.getElementById("a");
      var b = document.getElementById("b");
      var valid = true;

      if(a.value.length<=0 || b.value.length<=0 || a.value.trim()=="" || b.value.trim()=="")
      {
              alert("Don't leave the field empty!");
              valid = false;
      }

      if(isNaN(a.value) || isNaN(b.value))
      {
            alert("Enter a proper number!");
            valid = false;
      }

      var ele = document.getElementsByName("option");
      var flag=0;
      for(var i=0; i<ele.length; i++)
      {
        if(ele[i].checked)
        {
           flag=1;
           break;
        }
      }
      if(flag == 0)
      { 
         alert("No option selected!");
         valid = false;
      }
      return valid;
 };