javascript - JQuery setTimeout - 还有更有效的方法吗？

Question

所以我只是每隔一段时间切换和删除一些类——我对 JS 和 JQuery 还很陌生，但我已经做到了，效果很好:

function priceTable() {
    setTimeout(function(){$("#price-table-1").toggleClass("price-table-highlight");  },1000);
    setTimeout(function(){$("#price-table-1").removeClass("price-table-highlight");  },2000);
    setTimeout(function(){$("#price-table-2").toggleClass("price-table-highlight");  },2000);
    setTimeout(function(){$("#price-table-2").removeClass("price-table-highlight");  },3000);
    setTimeout(function(){$("#price-table-3").toggleClass("price-table-highlight");  },3000);
    setTimeout(function(){$("#price-table-3").removeClass("price-table-highlight");  },4000); 
}

但是，似乎有很多重复 - 有更好的方法吗？

Answer 1

对于 jQuery 动画方法，使用 delay 方法效果很好。对于其他 jQuery 方法，我可能会推荐 jquery.wait ，它的工作方式类似于 delay 但适用于所有 jQuery 方法。然后你的代码就变成了

function priceTable() {
  $('#price-table-1').wait(1000).toggleClass('price-table-highlight').wait(1000).removeClass('price-table-highlight');
  $('#price-table-2').wait(2000).toggleClass('price-table-highlight').wait(1000).removeClass('price-table-highlight');
  $('#price-table-2').wait(3000).toggleClass('price-table-highlight').wait(1000).removeClass('price-table-highlight');
}