javascript单选按钮多个值执行相同的验证检查

时间:2014-02-23 20:20:50

标签: javascript validation radio-button

当单选按钮值为1或2或3时,我想对名字和姓氏进行验证。

<form action="index.php" method="post" name="index">

<input type="radio" name="hello" value="abc">
<input type="radio" name="hello" value="def">
<input type="radio" name="hello" value="ghi">
<input type="radio" name="hello" value="jkl">
<input type="radio" name="hello" value="mno">

<input type="text" id="first-name" name="first-name">
<input type="text" id="last-name" name="last-name">

</form>

<script>

if ( $('input:radio[name=hello]:checked').val() == "abc" || $('input:radio[name=hello]:checked').val() ==  "def" || $('input:radio[name=hello]:checked').val() == "ghi" )
{

    if( ($('input[name=first-name]').val().length<1 ))
    {
        $('#first-name').focus();
        return false;
    }


    if( ($('input[name=last-name]').val().length<1 ))
    {
        $('#last-name').focus();
        return false;
    }
}

</script>

我写了这样的东西,但它不起作用。 甚至我选择“mno”的值,这是名字验证工作。 此函数也不会验证姓氏。

知道我做错了什么?

1 个答案:

答案 0 :(得分:0)

您正在使用javascript进行验证,但您应该在函数中使用此javascript并从您的表单中调用该函数,直到它不起作用,因为您没有调用此javascript意味着它无法正常工作。 以下是验证的简单代码,您可以通过它查看如何验证表单。希望这段代码可以帮到你。

<!DOCTYPE html>
<html>
<head>
<script>
function validateForm()
{
var x=document.forms["myForm"]["fname"].value;
 if (x==null || x=="")
{
 alert("First name must be filled out");
 return false;
}
}
</script>
 </head>

 <body>
<form name="myForm" action="demo_form.asp" onsubmit="return validateForm()" method="post">
First name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>
</body>