jquery - Jquery 淡入淡出

Question

我正在尝试淡出 div 元素，更改其中的文本，然后将其淡入...

我的代码在这里 -

<script>
        $(document).ready(function(){
            $("#l2").click(function(event){
                event.preventDefault();
                $("#1").fadeOut();
                $("#1").replaceWith('Testing');
                $("#1").fadeIn();
            });
        });
    </script>

单击l2，它将淡出div id 1替换并淡入...但它失败了..任何帮助谢谢！

Answer 1

您想使用.textor.html而不是.replaceWith-- 那是为了使用 DOM 元素。另外，.text不要.html使用队列，所以你不能链接它们。您必须使用回调：

$("#1").fadeOut(function () {
   $(this).text('Testing').fadeIn();
});

Answer 2

You need to use callbacks to achieve your goal:

$("#1").fadeOut(500, function(){
     $("#1").html('Testing');
     $("#1").fadeIn();
});

The function passed as a parameter will be executed when the fadeOut completes.

Answer 3

在第二行中，您将元素 #1 替换为新元素，然后您无法再次将其淡入。

$("#1").replaceWith('Testing');

结果在 div#1 被替换为文本测试

所以你应该改用：

$("#1").html('Testing');

Answer 4

只需使用淡出回调。这是一个快速的小提琴http://jsfiddle.net/M5PnY/2/ 点击文本

编辑 - - -

改成 html() 替换，之前没见过

$(document).ready(function(){
    $("#1").click(function(event){
        event.preventDefault();
        $("#1").fadeOut(function(event){
            $("#1").html('Testing').fadeIn();
        });
    });
});​