javascript - 几秒钟后隐藏 iframe 内容

Question

在我的网站上，我有一个联系表。当用户填写表单并按下发送按钮时，表单下方会显示一条消息。我希望消息在几秒钟后自行隐藏。我还想用颜色和居中对齐等来设置消息的样式。

HTML

<div class="container">
    <form action="form_process.php" method="post" name="contact_form" target="myIframe">
        <div class="row">
            <div class="col-md-4">
                <input type="text" class="form-control" name="name" id="name" placeholder="Your Name" required>
                <input type="email" class="form-control" name="email" id="email" placeholder="Your Email" required>
                <input type="text" class="form-control" name="sub" id="sub" placeholder="Subject" required>


            </div>
            <div class="col-md-8">
                <textarea class="form-control" name="msg" id="msg" rows="15" cols="10" placeholder="Your Message" required></textarea>
                <button type="submit" name="submit" class="btn btn-default submit-btn form-submit">SEND</button>
            </div>
        </div>
    </form>
    <div class="iframe-div">
        <iframe name="myIframe" id="myIframe">

        </iframe>
    </div>
</div>  

CSS

.iframe-div {
    text-align:center;
    color: #3978bd;
}
#myIframe {

    frameborder:0;
    border:0 ;
    cellspacing:0;
    border-style: none;
    width: 100%;
    height: 60px;
}

PHP

<?php
    $name = $_POST['name'];
    $email = $_POST['email'];
    $sub = $_POST['sub'];
    $msg = $_POST['msg'];

    $message=$_POST['message']. 'Name: ' . $name . '"\n"Email: ' . $email. '"\n"Subject: ' . $sub;
    $to = 'sample@gmail.com';
    $subject = 'New Message';

    mail($to, $subject, $message, $msg);
    echo "Your Message has been sent";
?>

Answer 1

你可以使用这样的东西:

$('.iframe-div').fadeIn('slow', function () {
    $(this).delay(3000).fadeOut('slow');
});

当然，您应该将其添加到脚本的成功逻辑中。
希望这可以帮助。

SYA:)