输入验证功能不工作

Input Validation function not working

本文关键字：工作 功能 验证 输入      更新时间：2023-09-26

我有一个函数来检查是否在电子邮件字段中输入任何文本，但它不工作。
我不知道我错过了什么。

这是我的表单:

<fieldset>
    <legend>Contact Information</legend>
    <form action="" id="contactInfo" onsubmit="checkform()">First Name:
        <input type="text" name="fname" id="fname">
        <br />Last Name:
        <input type="text" name="lname" id="laname">
        <br />Email:
        <input type="text" name="email" id="email">
        <br />
        <button type="submit">Submit</button>
    </form>
</fieldset>

这是我在一个单独的.js文件中的函数

function checkform(form) {
    if (document.form.email.value = "") {
        alert("Please enter your email address.");
        document.form.email.focus();
        return false;
    }
    return true;
}

下面是一个演示。

<fieldset>
    <legend>Contact Information</legend>
    <form id="contactInfo" onsubmit="checkform()">
        First Name: <input type="text" name="fname" id="fname"><br />
        Last Name: <input type="text" name="lname" id="laname"><br />
        Email: <input type="text" name="email" id="email"><br />
        <button type="submit">Submit</button>
    </form>
</fieldset>
JavaScript

function checkform(form) 
{
    console.log(form);
    if(document.forms[0].email.value == ""){
        alert("Please enter your email address.");
        document.form.email.focus();
        return false;
    }
    return true;
}

用这个代替:

 document.forms[0].email.value

或使用表单ID检索值

function checkform(form) {
    if (document.forms[0].email.value == "") {
        alert("Please enter your email address.");
        document.forms[0].email.focus();
        return false;
    }
}

小提琴

将表单作为参数this传递给checkForm()函数。这样，您就可以将checkForm()函数用于多种形式。像这样:

<fieldset>
    <legend>Contact Information</legend>
    <form action="" id="contactInfo" onsubmit="checkform(this)">First Name:
        <input type="text" name="fname" id="fname">
        <br />Last Name:
        <input type="text" name="lname" id="laname">
        <br />Email:
        <input type="text" name="email" id="email">
        <br />
        <button type="submit">Submit</button>
    </form>
</fieldset>

然后您可以从验证函数中访问没有document.前缀的表单元素，如下所示:

function checkform(form) {
    if (form.email.value == "") {
        alert("Please enter your email address.");
        form.email.focus();
        return false;
    }
    return true;
}

(另外，请确保检查form.email.value == ""而不是form.email.value = ""，这是赋值操作符)。

相关文章：