javascript - 简单的 jQuery 函数在 for 循环后仅返回零

Question

我有一个 jQuery 函数，我试图用它来最终使一些文本闪烁:

function blink() {

            var blinks = 7;
            blinks = blinks * 2; // Multiply by 2 to get an even number.
            var vis;

            for (i = 0; i < blinks; i++) {
                if (vis == 1) {
                    setTimeout(function () {

                        $("#ticker").animate({
                            opacity: 0
                        }, 0);
                        vis = 0;
                        alert(vis);

                    }, 500);
                } else {
                    //setTimeout(function () {

                    $("#ticker").animate({
                        opacity: 1
                    }, 0);
                    vis = 1;
                    alert("vis= " + vis);

                    //}, 500);
                }
            }

        }

现在，我只是想让它返回正确的数字(1 或 0)，具体取决于文本是否可见。如果文本已经打开，则该函数会将其关闭一次，但随后它会保持关闭状态，即使我正在重置“vis”变量以指示文本是否可见。然而，在 for 循环的第二次迭代之后，它只为 vis 变量返回零。我不确定是什么原因造成的。有谁知道我在这里做错了什么？我已经在这个问题上坚持了好几个小时了，所以如果您能给我任何帮助，我将不胜感激。

Answer 1

您正在同时启动多个异步操作。循环立即完成，但超时会稍后发生。

您可以使用一个无限计时器来简单得多，该计时器会停止并使用 fadeToggle() 淡入/淡出。

var count = 14;
var int = setInterval(function(){
    if (--count < 0){
        clearInterval(int);
    }
    $('#text').fadeToggle();
}, 500);

JSFiddle: http://jsfiddle.net/TrueBlueAussie/ev3b0das/

您可以使用数字和其他选项来尝试不同的效果(文本的初始隐藏等)

如果您不想淡入/淡出，请使用切换:

http://jsfiddle.net/TrueBlueAussie/ev3b0das/1/

如果您希望文本在末尾可见，请将计数设置为奇数:

http://jsfiddle.net/TrueBlueAussie/ev3b0das/2/