Javascript 如何在通过AJAX提交后显示模式表单

我有一个在模态中的表单登录。提交表单后，我会收到成功或失败的消息。让我们说失败消息。但当我重新打开模式时，会出现相同的消息，而不是登录表单。刷新页面后，只有modal显示登录表单

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

这是我的代码…请帮助我如何修复它，以便在提交后重新打开模式时显示登录表单

    <!--  Sign in feature starts here --> 
<div id="sign_in" class="modal fade" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Sign In</h4>
      </div>
      <div class="modal-body">
<div class="panel-body" id="form">
 <form class="form-horizontal" role="form" method="post" id="log-in" >
  <fieldset>
                                <div class="form-group">
                               <input class="form-control" id="username" placeholder=" Username or Mobile No." type="text" autofocus  AutoComplete=off required>
                                </div>
                                <div class="form-group">
                               <input class="form-control" id="password" placeholder=" Enter Password" type="password" autofocus  AutoComplete=off required>
                                </div>
                                 <!-- Change this to a button or input when using this as a form -->
                                <button class="btn btn-lg btn-success btn-block" type="submit">Sign In</button>
                            </fieldset>
  </form> </div>
</div>
          </div> 
</div></div>
 <!--  Sign In feature ends here -->
<script type="text/javascript">
$(document).ready(function()
{   
    $(document).on('submit', '#log-in', function()
    {
        var data = $(this).serialize();
        $.ajax({
        type : 'POST',
        url  : '<?php echo site_url('verifylogin');?>',
        data : data,
        success :  function(data)
                   {                        
                        $("#log-in").fadeOut(500).hide(function()
                        {
                            $("#form").fadeIn(500).show(function()
                            {
                                $("#form").html(data);
                                if(data != null && data == "success"){ //redirect...
                        window.location.replace('home.php');
                }
                            });
                        });

                   }
        });

        return false;
    });
});
</script>

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

&时代；
登录
登录
$（文档）.ready（函数（）
{   
$（文档）.on（'提交'，'登录'，函数（））
{
var data=$（this.serialize（）；
$.ajax({
键入：“POST”，
url:“”，
数据：数据，
成功：功能（数据）
{                        
$（“#登录”）.fadeOut（500）.hide（函数（）
{
$（“#form”）.fadeIn（500）.show（function（）
{
$（“#表格”）.html（数据）；
如果（数据！=null&&data==success）{//重定向。。。
window.location.replace（'home.php'）；
}
});
});
}
});
返回false；
});
});
问题出在
$（“#form”）.html（数据）
为什么要删除表单HTML并用接收到的数据替换它

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

什么时候将表单HTML放回模式中？它在刷新后工作，因为页面正在重新加载

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

在前面的例子中，您已经更新了DOM，删除了表单HTML，并将其替换为您正在接收的数据。因此，下次打开模式时，您将看到相同的数据。
问题在于
$（“#form”）.html（数据）
 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

为什么要删除表单HTML并用接收到的数据替换它

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

什么时候将表单HTML放回模式中？它在刷新后工作，因为页面正在重新加载

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

在前面的例子中，您已经更新了DOM，删除了表单HTML，并将其替换为您正在接收的数据。因此，下次打开模式时，您将看到相同的数据。
尝试更改此部分

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

到

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

i、 e.拆下此部件

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

在代码中的某个地方添加这个div；这是从PHP代码返回结果的div

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }



如果重定向是你的成功。然后在PHP代码的成功定义中添加重定向代码，即

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

<?php

echo 'please wait! redirecting...';
echo "<script>window.location.href='home.php';</script>";

?>

尝试更改此部分

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

到

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

i、 e.拆下此部件

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

在代码中的某个地方添加这个div；这是从PHP代码返回结果的div

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }



如果重定向是你的成功。然后在PHP代码的成功定义中添加重定向代码，即

 $("#form").html(data);
 if(data != null && data == "success")
 { //redirect...
       window.location.replace('home.php');
 }

<?php

echo 'please wait! redirecting...';
echo "<script>window.location.href='home.php';</script>";

?>

谢谢你的回答。。我猜你误解了这个问题…我的问题是表单提交后消息显示正确，但当我重新打开模式时，它会再次显示相同的消息，而不是显示登录表单。谢谢你的回答。。我猜你误解了这个问题…我的问题是表单提交后消息显示正确，但当我重新打开模式时，它会再次显示相同的消息，而不是显示登录表单；在表单提交后显示消息。请使用其他元素显示消息。理想情况下，它应该显示在成功/错误消息div/span中。您所做的错误是替换表单HTML并放置成功/错误消息。下次打开模式时，它将显示相同的消息。在模式正文div中放置一个新的span/div，该span/div将保存错误/成功消息。无论何时打开modal，请清除相同的span/div。非常感谢您……这对我帮助很大。但我不确定在哪里清除div（在我的例子中是msg）。关于我的代码，你能告诉我应该把$（“#msg”）.empty（）放在哪里吗；我已经使用java脚本实现了清除div。thanksi使用$（“#form”）.html（数据）；在表单提交后显示消息。请使用其他元素显示消息。理想情况下，它应该显示在成功/错误消息div/span中。您所做的错误是替换表单HTML并放置成功/错误消息。下次打开模式时，它将显示相同的消息。在模式正文div中放置一个新的span/div，该span/div将保存错误/成功消息。无论何时打开modal，请清除相同的span/div。非常感谢您……这对我帮助很大。但我不确定在哪里清除div（在我的例子中是msg）。关于我的代码，你能告诉我应该把$（“#msg”）.empty（）放在哪里吗；我已经使用java脚本实现了清除div。谢谢