gpt4 book ai didi

javascript - setTimeout 不起作用,在 for 循环中排队的其他方法?

转载 作者:行者123 更新时间:2023-12-02 17:00:28 25 4
gpt4 key购买 nike

下面的代码(在我的真实示例中,div 是有阴影的,我想依次将它们的不透明度降低到 0,以便每个元素按顺序消失。

我尝试在不使用 setTimeout 的情况下执行此操作,但所有 div 同时消失 - 很高兴知道更改不透明度的代码部分有效,但我似乎无法让它们按顺序工作。

当我尝试使用 setTimeout (我认为我实现不正确)时,什么也没有发生!

对此我将不胜感激,我对 JavaScript 相当陌生,已经有一段时间没有接触它了,教程也无法帮助我。

<body>
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<div id="div4"></div>

<script type="text/javascript">
// the divs that we want to cycle through are named here.
var divs = ["#div1", "#div2", "#div3", "#div4"];
var divsLength = divs.length;

for (var i = 0; i < divsLength; i++) {
setTimeout(function(){
$(divs[i]).fadeTo(1000, 0, function() {
});
},1500);
};

</script>
</body>

最佳答案

这是一种无需 setTimeout 即可完成此操作的方法:

function doFade(items, index) {
$(items[index]).fadeTo(1000, 0, function() {
doFade(items, index + 1);
});
}

doFade(divs, 0);

如果您的目标浏览器支持 ES5(大多数现代版本都支持),那么您可以进一步简化 doFade:

function doFade(items, index) {
$(items[index]).fadeTo(1000, 0, doFade.bind(this, items, index + 1));
}

working jsfiddle

关于javascript - setTimeout 不起作用,在 for 循环中排队的其他方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25769834/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com