javascript - 如何缓慢迭代 jquery 循环，并每次替换占位符文本

Question

我尝试了一些不同的方法，例如设置超时和每隔几秒调用一个函数，但我似乎可以让以下方法起作用:

var searchText = ["1", "2", "3", "4", "5"];


    for(x = 0; x < searchText.length; x++){

        // set the placeholder text
        jQuery('.banner .search-field').attr('placeholder', searchText[x]);



    }

上面的代码迭代了数组中的值，但是速度太快，用户看不到。我可以通过检查 console.log 看到它工作正常

我尝试过使用延迟功能，但无法使其工作。有没有办法让它在更新之间延迟？

Answer 1

您可以使用简单的 for 循环和 setTimeout 来实现，

var secs = 5;
var elem = jQuery('.banner .search-field');
for(x = 1; x <= secs; x++) {
  setTimeout(function(x) {
    elem.attr('placeholder', x);
  }, x * 1000, x);
}

DEMO