Question

我正在使用jQuery验证插件，它可以显示错误消息。但是，如果有人在未修复必填字段的情况下提交表单，则表单仍会提交。

怎么办我告诉jQuery如果表单无效，它不应该提交表单或做任何其他事情（比如淡出等）？

这是我的代码：

$(function(){
$("#my-form").validate();
});

$(function(){
$('form[name="required-form"]').submit(function(event){
    $('#required-form').fadeOut("slow", function () {
    $('#optional-form').fadeIn("slow");
});

相反，我想说这样的话：

$(function(){
$("#my-form").validate();
});

$(function(){
$('form[name="required-form"]').submit(function(event){
    // ONLY IF THE FORM IS VALID, ALLOW THE FORM TO SUBMIT, AND THEN CONTINUE BELOW
    $('#required-form').fadeOut("slow", function () {
    $('#optional-form').fadeIn("slow");
});

谢谢！

Answer 1

使用javascript或jquery提交表单时，即使标记为必需的字段为空，表单也会被提交。

您可以设置txtBox所需文本框的ID，并使用以下代码 -

$(function(){
$("#my-form").validate();
});

$(function(){
if($("#txtBox").val() != ""){
$('form[name="required-form"]').submit(function(event){
    $('#required-form').fadeOut("slow", function () {
    $('#optional-form').fadeIn("slow");
}
else{alert('Please fill in the required fields');}
});

您还可以使用表单的onsubmit事件，即。 <form onsubmit="return validate()">这样做。这可以按如下方式完成 -

$(function(){
$("#my-form").validate();
});

$(function(){
if($("#txtBox").val() == ""){return false;}
else{ 
return true;
//fade in and fade out here 
}
});

Answer 2

如果您发布html代码，问题将变得更加清晰。

您发布的代码缺少括号，可能会产生问题。通常，jQuery验证插件不会提交无效表单。

要显示自定义验证消息，请参阅：http://jqueryvalidation.org/reference/

jQuery validate plugin - 如果无效，如何阻止提交

2 个答案: