Question

我有以下jQuery代码：

setTimeout(function() {
    $("#ToDo1").removeClass("fa-spin fa-spinner");
    $("#ToDo1").addClass("fa-check-square");
    $("li:first").html("<i class='fa-li fa fa-check-square' id = 'ToDo1'></i>Download Complete");
    $("#ToDo2").addClass("fa-spin fa-spinner");
}, 2000);

setTimeout(function() {
    $("#ToDo2").removeClass("fa-spin fa-spinner");
    $("#ToDo2").addClass("fa-check-square");
    $("#ToDo3").addClass("fa-spin fa-spinner");
}, 3000);

setTimeout(function() {
    $("#ToDo3").removeClass("fa-spin fa-spinner");
    $("#ToDo3").addClass("fa-check-square");
    $("#ToDo4").addClass("fa-spin fa-spinner");
}, 5000);

setTimeout(function() {
    $("#ToDo4").removeClass("fa-spin fa-spinner");
    $("#ToDo4").addClass("fa-check-square");
}, 5550);

有没有办法缩短它，或者这是完成任务的唯一方法？谢谢！

Answer 1

可以做类似的事情：

var delays = [2000, 3000, 5000, 5500],
  $todos = $("#ToDo1, #ToDo2, #ToDo3, #ToDo4");

$.each(delays, function(i, delay) {
  setTimeout(function() {
      $todos.eq(i).toggleClass("fa-spin fa-spinner fa-check-square");
      $todos.eq(i + 1).addClass("fa-check-square");// will fail silently when it doesn't exist
    if (i === 0) {
      $("li:first").html("<i class='fa-li fa fa-check-square' id = 'ToDo1'></i>Download Complete");
    }
  }, delay);
});

请注意，当您注入html

时，您正在复制第一个中的ID

我们可以组合多个jQuery setTimeout

1 个答案: