Jquery .fadein .fadeout回调嵌套顺序不正确

jquery .fadein .fadeout callback nesting not ordering correctly

本文关键字：顺序 不正确 嵌套 回调 fadein fadeout Jquery      更新时间：2023-09-26

我试图嵌套淡出和淡出方法，以获得以下效果。我想在10个不同的标签字符逐一淡出，改变文本，然后淡入。根据我对回调函数的了解，下面的代码应该实现这一点，但我现在得到的效果是所有元素同时变化，文本变化不会等待导致文本闪烁的淡出，然后淡出和进入。我做错了什么!!以下是我目前拥有的一个简化版本。

HTML/PHP: 

<?php
echo '<div onclick="addname(this)">';
for ($i=0; i<10; i++){
    echo '<h1 id="temp'.$i.'">Y</h1>';
}
?>
Javascript 

function addname(item){
    //Other stuff that works fine
    hideChar(0);
}
function hideChar(i){
    if(i<10){
        var tag = "temp" + i;
        var x = document.getElementById(tag);
        $(x).fadeOut(200, showChar(i));
    }
}
function showChar(i){
    var tag = "temp" + i;
    var x = document.getElementById(tag);
    var j = i+1;
    $(x).html("X");
    $(x).fadeIn(200, hideChar(j));
}

您没有正确地将函数作为回调传递。当您包含()时—函数将立即触发—省略()以传递它:

$(x).fadeOut(200, showChar);

默认参数将被传递。如果您需要其他的东西，而不是默认的-您将不得不使用一个匿名函数来调用您的:

$(x).fadeOut(200, function() {
    showChar(i)
});
相关文章：