我有一个值数组,我想将这些值设置为输入的占位符。
如何仅使用jQuery.each()
来实现这一点,因为我用这个解决方案解决了我的问题,而且它运行得很好。
我试着这样做来重新启动它,但它不起作用:
if(index==arr.length) index=0;
HTML代码:
Values : <input name='input' id='input' />
JS/jQuery代码:
var arr = new Array();
for (var i = 0; i <= 5; i++) {
arr.push('Value ' + i);//fill array with values
}
function eachChange(){
var x=0;
$.each(arr, function (index, value) {
x++;
setTimeout(function(){
$('input').attr('placeholder', value);
}, x * 1000);
if(index==arr.length) index=0;
});
}
eachChange();//call function
小提琴:http://jsfiddle.net/charaf11/5ZQgX/
尝试以这种方式重新启动.each()
循环有两个问题。首先,.each()
并不是这样工作的。它不是一个循环,而是对每个元素调用函数的简写。如果您为该匿名函数命名(让我们使用setPlaceholder()
),那么.each()
调用本质上就是这样做的:
setPlaceholder(0, arr[0]);
setPlaceholder(1, arr[1]);
setPlaceholder(2, arr[2]);
setPlaceholder(3, arr[3]);
setPlaceholder(4, arr[4]);
setPlaceholder(5, arr[5]);
它传递给函数的索引值不用于循环目的,因此尝试将其设置为0不会对.each()
调用产生任何影响。
第二个问题是你的if条件。它永远不会真正启动,因为.each()
调用的最后一次"迭代"将以arr.length - 1
而不是arr.length
作为其值。
我不知道你为什么要让它保持循环,但如果这是你的目标,你可以这样完成:
function eachChange(){
$.each(arr, function (index, value) {
setTimeout(function() {
$('input').attr('placeholder', value);
}, index * 1000);
if (index == arr.length - 1) {
setTimeout(eachChange, (index + 1) * 1000);
}
});
}
eachChange();//call function
它应该做的是安排eachChange()
在最后一次占位符更新发生1秒后再次调用。你可以添加一些其他检查来限制它重复出现的次数,但如果你希望它无限期地发生,那就可以了。
这是一个更新的小提琴演示。
您可以将索引与类似的arr.length进行比较
var arr = new Array();
for (var i = 0; i <= 5; i++) {
arr.push('Value ' + i);//fill array with values
}
function eachChange(){
$.each(arr, function (index, value) {
setTimeout(function(){
$('input').attr('placeholder', value);
//if it is the last element in arr setTimeout and call eachChange()
if(index>=arr.length-1){
setTimeout(function(){
eachChange();
},1000);
}
}, index * 1000);
});
}
eachChange();
http://jsfiddle.net/R274P/1/
我认为你不能重置$.each函数的计数器,因为它似乎封装了一个简单的for循环。你不能从外面进入柜台。
但是,请尝试:
function eachChange(initX){
var x = initX || 0;
$.each(arr, function (index, value) {
x++;
setTimeout(function(){
$('input').attr('placeholder', value);
}, x * 1000);
// Call yourself but pass current x
if(index==arr.length) eachChange(x);
});
}
如果您希望x重置,请删除initX部分,但我认为您希望它继续从上一个循环结束的位置开始计数。