Javascript 在“提交”按钮上单击，希望提交表单并显示隐藏的div

我已经为表单提交编写了PHP：

if($_POST['submit']) {
    $recipient="test@gmail.com";
    $subject="A Hooray moment has been shared with you";
    $sender=$_POST["sender"];
    $senderEmail=$_POST["senderEmail"];
    $message=$_POST["message"];

    $mailBody="Name: $sender\nEmail: $senderEmail\n\n$message";

    mail($recipient, $subject, $mailBody, "From: $sender <$senderEmail>");
?>

我现在已经编写了javascript，在单击submit按钮后显示DIV，没有CSS显示：none设置。这是当前的Javascript：

$('document').ready(function() {
    $('.done').hide();
    $('.button').click(function(e) {
          $('.done').show();
          //e.preventDefault();
    });
});

当我填写表单并点击提交按钮时，PHP将加载，但div不会出现。我收到一封确认电子邮件（如我所愿），但没有div。当我设法让div出现时，PHP部分停止工作（点击提交按钮将显示隐藏的div，但表单实际上没有提交，我没有收到电子邮件）。当PHP部分工作时，我收到一封确认电子邮件，然后.done div就不会显示了。下面是我的html供参考

我正在寻找一种在单击submit按钮后显示div和表单submit（两个事件）的方法。用PHP（或JS）编写这一切是有道理的，但我对PHP还不太熟悉，无法理解这一点。提前感谢您的帮助

<div class="col-md-6 col-md-offset-3">
    <div class="done">
        <h2>HOORAY!!!</h2>
        <img src="http://usatftw.files.wordpress.com/2013/11/824607200.gif?w=1000" alt="Touchdown dance" style="width:500px;height:400px; margin-top:0px; padding-top:0px;"></img>
    </div>
    <div class="form-group col-md-6 col-md-offset-3">
        <input type="radio" class="form-control radio" id="radio1"/>OMG! The greatest thing happened today...<br />
        <input type="radio" class="form-control radio" id="radio2"/>You wouldn't believe what happened...<br />
        <input type="radio" class="form-control radio" id="radio3"/>No s*** you'll never guess what happened...<br />
    </div>

    <form method="post" action="testemailform.php" id="form">
        <div class="container1">
            <input name="sender" placeholder="Name (Optional)">
        </div>
        <div class="container2">
            <input name="senderEmail" placeholder="Your Email (Optional)">
        </div>
        <div class="container3">
            <textarea rows="5" cols="50" name="message" placeholder="Tell me what happened!"></textarea>
        </div>
        <div class="button">
            <input type="submit" name="submit">
        </div>
    </form>
</div>

好极了
天啊！今天发生了最伟大的事情……

你不会相信发生了什么…

不，你永远猜不到发生了什么…

提交表单时，使用php显示div，而不是javascript

因此，创建新的php变量$css来保存样式表代码

<?php

//keep variable blank when page is loaded first time
$css = "";

if($_POST['submit']) {

   //add css to variable when form is posted
   $css = "display: none;";

   ...your email code goes here...

}
?>

现在在html中，打印$css变量

<div class="done" style="<?php echo $css; ?>" >

当您提交表单时（正在执行），页面将重新加载。。因此，在此之前的任何JS功能都是毫无意义的，因为您希望Javascript记住，在最后一页上，您单击了一个按钮

使用PHP在表单提交后设置一个变量'after'，然后可以使用该变量确定是否显示额外的

<div class="done" style="<?php echo $css; ?>" >