Question

在我的HTML表单中，我有

<label for="email">Email:</label> 

<input type="email" name="email" id="email" required /><br><br> 

<label for="confemail">Confirm Email:</label> 

<input type="email" name="confemail" id="confemail" required /><br><br>

在我的外部JS文件中，我有函数

function confirmEmail() {
        var email = document.getElementById("email").value
        var confemail = document.getElementById("confemail").value
        if(email != confemail) {
            alert('Email Not Matching. Try again');
        }
    }

如何实现此功能？当我提交表单时，它实际上并没有使用该功能。如果我在表单中添加2个不同的电子邮件，它可以让我继续。我不是在谈论添加<script type="text/javascript" src="file.js"></script>

Answer 1

将以下属性添加到表单的提交按钮：onclick="return confirmEmail()"。

像这样：

<input type="submit" onclick="return confirmEmail()" />

这将是你的功能：

function confirmEmail() {
    var email = document.getElementById("email").value
    var confemail = document.getElementById("confemail").value
    if(email != confemail) {
        alert('Email Not Matching. Try again');
        return false;
    }
    return true;
}

说明：

您在提交按钮上的onclick event handler将调用您的功能。在您的onclick事件上返回false会阻止表单提交。因此，如果您的电子邮件应该是相同的条件，则表单将不会提交。

还有其他捕获提交事件的方法。例如，在<form>元素上使用onsubmit event handler。

调用外部JS函数来验证电子邮件

1 个答案: