Question

我正在尝试将php回显到html，一切正常但是回显停留在页面上直到刷新它消失。无论如何我可以使用jquery淡入，出来吗？

php编码的一部分：

$q1=mysql_query("SELECT `DEALS` FROM `show` LIMIT 1");
$d1=mysql_fetch_array($q1);
$n2=$d1['DEALS'];
if($n2!=0){

foreach($addresses as $to) { 
mail($to, $subject, $message, $headers);
}
echo'<center><span class="text-wrapper-2 text-wrapper-green">Email Sent!
</span></center>';
}
else{

echo'<center><span class="text-wrapper-2 text-wrapper-red">Email Failed</span></center>';    
}

所以上面的代码正确回显到html，但我想添加一些jquery面部效果。任何建议都会很棒。

提前感谢所有人。

Answer 1

将其包装到div标签中，并带有您可以选择的类

<div class="someClass" style="display:none">  your code here </div>

并有一个脚本标记并将您的javascript放在这里

<script>
$(function(){
    $('.someClass').fadeIn();
});
</script>

然后回显该代码

Answer 2

PHP完成后，JavaScript交互完全发生在客户端。所以基本上你会回显输出，然后做客户端效果。所以，让我们回答一下这样的事情：

<span class="text-wrapper-2 text-wrapper-green" id="emailMessage" style="display:none;">Email Sent!</span>

请注意，我在元素中添加了id以便于识别。我还给它一个不显示的内嵌样式，因为你希望它首先淡入。随意将该样式移动到CSS中。

然后在您的客户端代码中，您可能会遇到以下情况：

$('#emailMessage').fadeIn(400, function () {
    setTimeout(function () {
        $('#emailMessage').fadeOut();
    }, 5000);
});

这会淡化元素，然后设置一个计时器，在5秒后将其淡出。

Answer 3

这只是一种方法。但是对你的php脚本执行ajax调用，然后在淡入淡出时显示结果。

<script type="text/javascript">
    $(document).ready(function() {

        $('.buttonPush').on('click', function() (

            if (!$(this).hasClass('pushed'))
            {
                $('.buttonPush').addClass('pushed');

                $.ajax('/link/to/php/page', {


                }).done(function(data) {

                    $('.myElem').html('your html').fadeIn();

                    $('.buttonPush').removeClass('pushed');
                });
            }
        ));
    });
</script>

<div class="myElem">

</div>

php回显到html与jquery淡入淡出效果

3 个答案: