【问题标题】:'success' dialog after jquery form validation clears and submits - showing success message no matter whatjquery表单验证清除并提交后的“成功”对话框 - 无论如何都显示成功消息
【发布时间】:2011-11-14 01:28:32
【问题描述】:

我有一个简单的电子邮件表格:

<form method="post" action="process-form.php" id="emailForm" name="emailForm" target="_self">
    <h4>Sign up to be notified when we go live!</h4>
<label for="email">E-mail</label>
    <input type="text" name="email" id="email" />
<input type="submit" name="submit" id="submit" value="Submit"  onclick="return alert('Thanks! Your email has been added.');">

    <p>emails will not be shared with third parties</p>
</form>

我正在使用以下 jQuery 验证:

/*
Created 09/27/09                                        
Questions/Comments: jorenrapini@gmail.com                       
COPYRIGHT NOTICE        
Copyright 2009 Joren Rapini
*/  

$(document).ready(function(){
// Place ID's of all required fields here.
required = ["email"];
// If using an ID other than #email or #error then replace it here
email = $("#email");
errornotice = $("#error");
// The text to show up within a field when it is incorrect
emptyerror = "Please fill out this field.";
emailerror = "Please enter a valid e-mail.";

$("#emailForm").submit(function(){  
    //Validate required fields
    for (i=0;i<required.length;i++) {
        var input = $('#'+required[i]);
        if ((input.val() == "") || (input.val() == emptyerror)) {
            input.addClass("needsfilled");
            input.val(emptyerror);
            errornotice.fadeIn(750);
        } else {
            input.removeClass("needsfilled");
        }
    }
    // Validate the e-mail.
    if (!/^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/.test(email.val())) {
        email.addClass("needsfilled");
        email.val(emailerror);
    }

    //if any inputs on the page have the class 'needsfilled' the form will not submit
    if ($(":input").hasClass("needsfilled")) {
        return false;
    } else {
        errornotice.hide();
        return true;
    }
});

// Clears any fields in the form when the user clicks on them
$(":input").focus(function(){       
   if ($(this).hasClass("needsfilled") ) {
        $(this).val("");
        $(this).removeClass("needsfilled");
   }
});
}); 

表单验证成功后,我希望显示一个成功对话框。我现在有点像提交按钮的onClick 事件,但显然无论它是否验证都会显示消息。我认为消息需要放在验证中的某个地方。

【问题讨论】:

    标签: javascript jquery forms validation jquery-validate


    【解决方案1】:

    在您的 onsubmit 函数结束时,您返回 'true'。

    【讨论】:

    • 会不会像 alert('Thanks!'); ?
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-07-19
    • 1970-01-01
    • 2016-03-19
    • 1970-01-01
    • 2022-07-06
    • 1970-01-01
    相关资源
    最近更新 更多