javascript - 阻止 jQuery 将整个页面返回到我的 div 中

Question

所以我有一个具有 'create_topic_parse.php' 操作的表单，它将输入值从 'create_topic_parse.php' 发送到该表单，然后它们被插入到数据库中。我可以使用以下代码将任何错误从 'create_topic_parse.php' 文件发送到我的 'create_topic_parse.php' 页面中的 'message' div:

$("#submit").click( function() {
 // I've tried e.preventDefault(); here ^ but it's giving the same result.

      $.post( $("#topic_form").attr("action"),
             $("#topic_form :input").serializeArray(),
             function(info) {

               $("#message").empty();
               $("#message").html(info).css('color','#be4343');

            });

    $("#topic_form").submit( function() {
       return false; // Not working

    });
});

当表单输入正确，并且 PHP 文件没有传递任何错误时，PHP 脚本应该将用户重定向到 'view_topic.php?cid=".$cid."&tid= “.$new_topic_id。”&page=1'。如果我不包含上面的 jQuery，则效果很好。

问题:如果我包含 jQuery 脚本，它会将整个 'view_topic.php/etcetc' 页面返回到 ''，这是不好的。

所以问题是，有谁知道如何防止整个页面被发布到这个div中，并在表单正确提交时实际将用户重定向到“view_topic.php”页面？

注意:我尝试过 window.location，但是我遇到了 PHP 文件中连接变量的问题，这些变量被输入到“view_topic.php/etcetc”url 中。我试图让它与 header('location:...') 一起使用，就像不包含 jQuery 文件时一样。

提前致谢，

里奇

解决方案:

jQuery + Ajax 到 PHP:

if($('#topic_title').val() == ''){
    $('#message').html("You need to give your topic a title.");
}

使用此代码，我能够检查每个数据条目是否存在，当所有数据值都存在时，我将在同一文件中运行 AJAX 脚本，将每个值传递到变量中，如下所示:

var submit = $('#submit').val();
var topic_title = $('#topic_title').val();


$.ajax({
        type: "POST",
        url: "create_topic_parse.php",
        data: {submit:submit, topic_title:topic_title),

等等等等

Answer 1

试试这个。会起作用的当表单正确提交时，只发送一些像“正确”这样的字符串，并在 jquery 中让你检查输出字符串。如果它“正确”，则将其重定向到通过 JavaScript 查看主题。

如果您想将用户重定向到从服务器发送的特定页面，则从服务器以 json 格式发送类似的内容。

在服务器上编写类似这样的代码。

if ($condition==true) {
    $ajax_return = array(
        'message' => 'correct',
            'url' => 'your_redirect_url'
    );           
}
else
{
    $ajax_return = array(
        'message' => 'your user defined error message',
        'url' => 'leave it blank'
    );
}
$ajax_return = json_encode($ajax_return);
echo $ajax_return;

现在 create_topic.php 页面上有 jquery

$("#topic_form").submit( function(e) {
      e.preventDefault();
      $.post( 
            $("#topic_form").attr("action"),
            $("#topic_form :input").serializeArray(),
            function(info) {
                   info= JSON.parse(info);                       
                   if(info.message="correct"){
                       window.location=info.url;
                   }
                   else{
                       $("#message").html('');
                       $("#message").html(info).css('color','#be4343');
                   }

            });

});

我确信现在它会起作用。如果没有，请告诉我。