Question

我正在尝试使用jquery做一些简单的事情......我是一名学生。我有一个名为错误的div，如果div中没有文本，我希望它被隐藏。但是如果文本进入它我希望它出现或淡入，并显示几秒钟然后淡出并从div中删除文本。

请你告诉我你做了什么来解决我的问题所以我可以从中学习吗？

以下是我的脚本：

<script type="text/javascript">
$(document).ready(function(){
  if ($("#error").text().length != 0) {
     $("#error").show().delay(2800).fadeOut().empty();
   }    
  else if($("#error").text().length == 0){
       $("#error").hide();
   }
 });
</script>

Answer 1

empty不是动画，因此不会放在动画队列中。它将立即执行。改为在回调中调用它：

...delay(2800).fadeOut(function() {
   $(this).empty();
});

Demo

如果您遇到其他问题，如果您描述了您面临的确切问题，则会有所帮助。请注意，如果div中有空格，.text.length将不会为零。

Answer 2

使用 $（本）.empty（）;而不是直接empty（）

Answer 3

试试这个

$('#error').bind("DOMNodeInserted",function(){

  if ($("#error").text().length != 0) {
     $("#error").fadeIn();
     setTimeout (function(){
     $("#error").delay(2800).fadeOut().empty()
     },1000);
   }    
  else if($("#error").text().length == 0){
       $("#error").hide();
   }
});

它对我有用。

Answer 4

尝试使用：

$(document).ready(function(){
    if ($("#error").text().length != 0) {
        $("#error").hide().delay(1000).fadeIn(2500);
        $("#error").hide().delay(1000).fadeOut(2500, function() {
            $("#error").empty();
        });
    }    
    else if($("#error").text().length == 0){
        $("#error").hide();
    }
});

使用延迟和fadeIn显示隐藏状态的div内容：

$("#error").hide().delay(1000).fadeIn(2500);

将div内容返回到隐藏状态，延迟和fadeOut +回调以清空div：

$("#error").hide().delay(1000).fadeOut(2500, function() {
    $("#error").empty();
});

我已经在我的xampp localhost上对它进行了测试，它完成了这项工作。

干杯！

jQuery隐藏，显示，延迟，淡出，空div脚本

4 个答案: