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

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事件处理程序将调用您的函数。 如果onclick事件返回false ，则无法提交表单。 因此，如果您的电子邮件条件相同，则该表单将不会提交。

还有其他捕获提交事件的方法。 例如，通过在<form>元素上使用onsubmit事件处理程序 。