javascript - 无法匹配 HTML 和 JAVASCRIPT 中的模式

Question

伙计们，我用 html 和 js 编写了这个代码。它只是简单的三个输入，NAME、EMAIL 和 PASSWORD。我验证了这个简单的表格，javascript但它没有按预期工作。我希望如果我对三个输入中的任何一个输入错误，它应该提醒我“请输入有效的凭据”。如果我对所有这些都给出正确的输入，它应该会提醒我“恭喜！您的表单已提交。”。

我给 NAME 字段的验证是如果名称的长度小于 1，它应该返回 false，否则返回 true。我对 PASSWORD 字段的验证与 NAME 字段相同，您可以在下面的代码中看到我对所有字段的验证。当我只在一个字段中输入错误时，它仍然显示“恭喜！您的表单已提交。”

它没有按预期工作！

function ValidateForm(username, email, password)
{
    if ((validateusername(username) || validateemail(email) || validatepassword(password))==false)
    {
        alert("Please Enter Valid Credentials.")
        return false
    }
    else if ((validateusername(username))==true && (validateemail(email))==true && (validatepassword(password))==true)
    {
        alert("Congrats! your form submitted.")
    }
}

function validateemail(email)  
{  
    var x = email.value;  
    var atposition = x.indexOf("@");  
    var dotposition = x.lastIndexOf(".");  
    if (atposition<1 || dotposition<atposition+2 || dotposition+2>=x.length)
    {  
        return false;  
    }
    else
    {
        return true
    }
}

function validateusername(username)
{
    if (username.length<1)
    {
        return false;
    }
    else
    {
        return true
    }
}

function validatepassword(password)
{
    if (password.length<1)
    {
        return false;
    }
    else
    {
        return true
    }
}

 
    <form name="myForm"> 
        <input type="text" name="Name" placeholder="Enter Name">
        <input type="text" name="EmailAddr" placeholder="Enter Email">
        <input type="text" name="Password" placeholder="Enter Password">  
        <button type="submit" onclick="ValidateForm(document.myForm.Name, document.myForm.EmailAddr, document.myForm.Password)">Submit</button>
    </form>

标签： javascript

Answer 1

问题是您的 if 语句条件。

(validateusername(username) || validateemail(email) || validatepassword(password))==false

是相同的

!validateusername(username) && !validateemail(email) && !validatepassword(password)

所以你说只有当所有 3 个验证都失败时才被认为是无效的。