淡化效果影响我的输出

时间:2016-06-09 11:26:28

标签: javascript php jquery

这是我的剧本:

<div id ="success-message">

</div>


 <script>
 $('form.subscribe').on('submit', function() {
var that = $(this),
url = that.attr('action'),
method = that.attr('method'),
data ={};
 that.find('[name]').each(function(index, value) {
  var that = $(this),
  name = that.attr('name'),
  value = that.val();

data[name] = value;
 });

$.ajax({
url: url,
type:method,
data: data,
success: function(response){


$('#success-message').html(response)

}

});

return false;


 });

setTimeout(function() {
    $('#success-message').fadeOut('slow');
}, 2000); // <-- time in milliseconds
    </script>

我有一个ajax函数,它根据您在表单上的输入提供错误消息或成功消息。

我得到的消息来自这个PHP脚本:

<?php
    header("Refresh:7; url=contact.php");
    $email = $_POST['subscribefield'];

    if (!filter_var($email, FILTER_VALIDATE_EMAIL)) {
        echo "Dit emailadres klopt niet";
        die();
    }

    $to = "flash1996mph@hotmail.com";
    $subject = "Abonee voor de nieuwsbrief";
    $body = "$email \n Heeft zich aangemeld voor de nieuwsbrief";

    mail($to, $subject, $body);
    echo "U heeft zich zojuist aangemeld voor de vandenberg nieuwsbrief";
?>

我现在正在一个名为success-message的div中输出php文件中的2个echo,到目前为止一直很好。但我想在一段时间后让消息消失,所以我添加了这个功能:

setTimeout(function() {
    $('#success-message').fadeOut('slow');
}, 2000); // <-- time in milliseconds

但现在它只显示错误,例如,当出现错误时,现在它只在表单未正确填写时显示一条消息。当它正确填充时,我什么也得不到。

2 个答案:

答案 0 :(得分:1)

在您将回复写入div后,如果您已将其隐藏,请务必再次显示div。

类似的东西:

$('#success-message').html(response).show();

答案 1 :(得分:1)

setTimeout()代码块放在success函数中。当您运行代码时,它会立即#success-message css到display:none

所以,你可以解决它:

$.ajax({
url: url,
type:method,
data: data,
success: function(response){

$('#success-message').html(response);

setTimeout(function() {
    $('#success-message').fadeOut('slow');
}, 2000);

}

});