0

我是 JavaScript 新手，我一直在做基于 HTML 和 JavaScript 的大学作业。在这项任务中，我被要求创建一些表格，以允许一个人注册某种形式的教育课程。我被要求使用 HTML 创建表单并仅使用 JavaScript 验证条目。

firstname我一直在努力弄清楚的是如何使用一个验证块来验证多个表单输入（如果可能的话），我想familyname只使用validateForm.

这是我一直在测试的一段：

<head>
    <script>
        function validateForm() {
            var x = document.forms["nameform"]["firstname"].value;
            if (x == null || x == "") {
                alert("first name must be filled out");
                return false;
            }
        }
    </script>
</head>
<body>
    <form name="nameform" , action="demo_form.asp" , onsubmit="return validateForm()" , method="post">
<b>First name:</b> 
        <input type="text" name="firstname">
        <br>
<b>Family name:</b> 
        <input type="text" name="familyname">
        <br>
        <input type="submit" value="Submit">
    </form>
</body>

任何帮助将不胜感激！

4

5 回答 5

0

您可以检查所有输入、存储错误消息（如果有）并在最后返回 false（如果有一个失败）。

IE

function validateForm() {
    var x = document.forms["nameform"]["firstname"].value, errors = [];
    if (x == null || x == "") {
        errors.push("first name must be filled out");
    }
    x = document.forms["nameform"]["familyname"].value;
    if (x == null || x == "") {
        errors.push("family name must be filled out");
    }
    if(errors.length > 0) { // check if there were any errors
        alert(errors.join("\n")); // alert all messages together
        return false;
    }
}
于 2013-04-04T12:38:03.450 回答
0 
<head>
<script>
function validateForm()
{
  var firstname=document.getElementById('txtfirstname');
  var familyname=document.getElementById('txtfamilyname');

   if (firstname.value=="")
       {
         alert("first name must be filled out");
         return false;
        }
  if (familyname.value=="")
     {
         alert("familyname must be filled out");
         return false;
     }

 }
</script>
</head>

<body>
<form name="nameform", action="demo_form.asp", onsubmit="return validateForm()", method="post">
<b>First name:</b> <input type="text" id="txtfirstname" name="firstname">
<br>
<b>Family name:</b> <input type="text" id="txtfamilyname" name="familyname">
<br>
<input type="submit" value="Submit">
</form>

</body>
于 2013-04-04T12:38:57.797 回答
0

只需将其存储在多个变量中并具有多个 if 语句：

<script>
    function validateForm() {
        // name the variables appropriately
        var firstname = document.forms["nameform"]["firstname"].value;
        var familyname = document.forms["nameform"]["familyname"].value;
        // check if either of them are correct, if not alert and return false.
        if (firstname == null || firstname == "") {
            alert("first name must be filled out");
            return false;
        } else if (familyname == null || familyname == ""){
            alert("family name must be filled out");
            return false;
        }
        return true;
    }
</script>
于 2013-04-04T12:41:04.587 回答
0

几种可能性...

<script>
function validateForm()
{
    var x=document.forms["nameform"]["firstname"].value;
    if (x==null || x=="")
    {
        alert("first name must be filled out");
        return false;
    }
    x=document.forms["nameform"]["lasttname"].value;
    if (x==null || x=="")
    {
        alert("last name must be filled out");
        return false;
    }
return true;
}
</script>

将在验证失败时为每个字段显示警报，如果所有字段都正常，则返回 true。

<script>
function validateForm()
{
    var errorString="";
    var x=document.forms["nameform"]["firstname"].value;
    if (x==null || x=="")
    {
        errorString+="first name must be filled out\n";
    }
    x=document.forms["nameform"]["lasttname"].value;
    if (x==null || x=="")
    {
        errorString+="last name must be filled out\n";
    }
    if(errorString=="")
    {
        return true;
    }
    else
    {
        alert(errorString);
        return false;
    }
}
</script>

将返回一个警报，列出所有未通过验证的字段。

此外，我总是喜欢在第一个验证失败的字段上使用 focus() 方法将光标放在需要更正的字段中。

于 2013-04-04T12:46:11.353 回答
0

试试这个..

function validateForm() 
{
    var msg='';
    var flag=false;
        var x = document.forms["nameform"]["firstname"].value;
        if (x == null || x == "") 
        {
            flag = true;
            msg = ' First Name '
        }
        x = document.forms["nameform"]["familyname"].value;
        if (x == null || x == "") 
        {
            if(flag==true)
                msg = msg + 'And Family Name '
            else
                msg = msg +  ' Family Name ';
            flag = true;
        }
        if (flag==true) {
            msg = msg + " must be filled out";
        alert(msg);
        }
        return false;
}
于 2013-04-04T12:46:48.133 回答