Question

我正在使用jquery.validate.min.js脚本，并且就验证而言它的工作正常。

我的问题是它应该发布/提交数据，但我需要它在成功提交后实际转到success.php页面。

现在它只是来自success.php的回声并显示在我的主页面中。

以下代码如何：

<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script>
$(document).ready(function() {

$("#form1").validate({

    debug: false,
    rules: {
    name: "required",
    email: {
    required: true,
    email: true,
    }
    },
    messages: {
    name: "Please enter your name.",
    email: "Please enter a valid email address.",
    },
    submitHandler: function(form) {

    $.post('success.php', $("#form1").serialize(), function(data) {
    $('#result').html(data);
    });

    }
});

}); 


<form id="form1" action="success.php" method="POST">
    <input name="name" type="text" />
    <input name="email" type="text" />
    <input type="submit" value="submit" />
</form>
</script>

成功提交后，如何让它转到发布页面？

Answer 1

您的代码：

submitHandler: function(form) {
    $.post('success.php', $("#form1").serialize(), function(data) {
        $('#result').html(data);
    });
}

“现在它只是来自success.php的回声并显示在我的主页面中。”

是的，这正是jQuery $.post()应该起作用的方式。它是ajax。

只需从submitHandler删除整个.validate()回调函数即可。如果你只是想让它重定向到默认页面，那么在这种情况下使用ajax提交表单真的没有意义。移除submitHandler选项，它的行为类似于标准表单，其中包含基于action属性的重定向。

默认情况下，插件会测试有效性，如果表单有效，则会像其他任何标准表单一样提交，并按照action="success.php"进行操作。

工作演示：http://jsfiddle.net/yCePj/

$(document).ready(function () {

    $("#form1").validate({
        debug: false,
        rules: {
            name: "required",
            email: {
                required: true,
                email: true,
            }
        },
        messages: {
            name: "Please enter your name.",
            email: "Please enter a valid email address.",
        }
    });

});

Answer 2

这个怎么样？

    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<script>
$(document).ready(function() {

$("#form1").validate({

    debug: false,
    rules: {
    name: "required",
    email: {
    required: true,
    email: true,
    }
    },
    messages: {
    name: "Please enter your name.",
    email: "Please enter a valid email address.",
    }
});

}); 

function SubmitIfValid()
{
    if(!$("#form1").valid()) return false;  
    return true;
}

</script>

<form id="form1" action="success.php" method="POST">
    <input name="name" type="text" />
    <input name="email" type="text" />
    <input type="submit" value="submit" onclick="return SubmitIfValid();" />
</form>

jQuery验证并在成功提交后转到页面

2 个答案: