0

单击表单提交按钮时，将调用验证所有字段的函数。但是，如果验证失败，则不会发生任何事情。

我正在使用mailto:作为我的行动，这有什么不同吗？
我想澄清两件事：

  1. 这是单击提交按钮时调用函数的正确方法吗？

    $(document).ready(function(){
    $('#contactForm').submit(function(){
        checkMail();
    });
});

  2. 即使我正在使用，我仍然可以验证这些字段mailto:吗？

这是其余的代码：

function checkEmail(){
    var email = document.contact.email.value;

    if(email == "") {
        document.getElemtById("email_error").innerHTML = "No Email Address";
        return false;
    }
    else {
        document.getElementById("email_error").innerHTML = ""
        return true;
    }
}

HTML：

<form name="contact" action="mailto:exampleemail@hotmail.com" method="post">
    <li>
        <label for="email">Email</label>
    <input id="email" type="text" name="email" placeholder="Enter Email Address">
    </li>
    <span id="email_error"></span>

此外，单击提交时我没有收到错误消息。

4

3 回答 3

1

不，您需要事件处理程序return false以防验证失败。这将阻止执行该操作，即启动邮件程序。

我们可以通过在事件对象上调用 .preventDefault()或从我们的处理程序返回 false来取消提交操作。

来源

像这样修改它：

$(document).ready(function(){
    $('#contactForm').submit(function(){
        return validate();
    });
});

当然，这意味着如果验证失败，validate()函数需要实际返回，否则。false true

此外，您的标签上还缺少id="contactForm"您。<form>

此外，您需要正确获取电子邮件值：

var email = $("#email").val();

还有一个错误：你拼错了getElementById(). 这是一个更正的版本：

function checkEmail() {
    var email = $("#email").val();

    if (email == "") {
        document.getElementById("email_error").innerHTML = "No Email Address";
        return false;
    }
    else {
        document.getElementById("email_error").innerHTML = ""
        return true;
    }
}

或者，使用所有 jQuery：

function checkEmail() {
    var email = $("#email").val();
    var $error = $("#email_error");
    if (email == "") {
        $error.html("No Email Address");
        return false;
    }
    else {
        $error.html("");
        return true;
    }
}
于 2012-10-04T10:11:00.763 回答
0

这是您需要的：

$(document).ready(function(){
   $('#contactForm').submit(function(){
       if (!validate()) {
           return false; // Prevent the submit
       }
   });
});
于 2012-10-04T10:10:11.507 回答
0

为了验证表单的字段，在发送之前，您可以使用 jQuery 的验证插件：

$(document).ready(function(){

    $("#contactForm").validate({
        submitHandler: function(form) {
            // some other code
            // maybe disabling submit button
            // then:
            $(form).submit();
        }
    });

});

查看在线文档以获取更多信息和示例：http ://docs.jquery.com/Plugins/Validation#Validate_forms_like_you.27ve_never_been_validating_before.21

于 2012-10-04T10:11:50.747 回答