我有100个数字的数组,我想向其中的20个添加活动类,这部分工作正常。但是我想在每个数字之间延迟。
我尝试使用settimeout,但一次只能将所有数字延迟5秒,但是我想将活动类一一设置为5秒。请帮忙。
function numbers() {
var activequantities;
activequantities = "@Html.DisplayFor(modelItem => item.Numbers)".split(",");
// this is array with sorted random numbers 20 of 100 example [22,33,46,57,etc]
function setClassNextItem(index)
{
if (index >= activequantities.lenght) return;
var value = activequantities[index];
$(`.grid-container div[data-tabid=${value}]`).addClass('active');
setTimeout(setClassNextItem(++index), 5000);
}
$(".grid-container div").removeClass('active');
setTimeout(setClassNextItem(0), 5000);
}
<div class="grid-container">
<div class="grid-item">
<div class="grid-container2">
<div class="grid-item2" data-tabid="1">1</div>
<div class="grid-item2" data-tabid="2">2</div>
<div class="grid-item2" data-tabid="3">3</div>
<div class="grid-item2" data-tabid="4">4</div>
</div>
依次添加活动的班级。每个数字之间有5秒的延迟。
最佳答案
尝试将activequantities
转换为数字数组,然后执行以下操作:
function setClassNextItem(index)
{
if (index >= activequantities.lenght) return;
var value = activequantities[index];
$(`.grid-container div[data-tabid=${value}]`).addClass('active');
setTimeout(setClassNextItem(++index), 5000);
}
$(".grid-container div").removeClass('active');
setTimeout(setClassNextItem(0), 5000);
关于javascript - 为数组中的一个数字设置5秒超时,但不能一次全部超时,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/58249900/