Question

我的页面上有几个按钮，我想在一定时间内将焦点切换到每个按钮上。我如何用jquery或纯javascript实现这一点。这是我按照所有按钮迭代的想法，但我显然最终关注了我的最后一个按钮。

$(document).ready(function() {
var allButtons = $(":button");
for (i=0;i<=allButtons.length;i++) {
   $('.category_button')[i].focus()
}
});

Answer 1

您可以通过在for循环中创建闭包并将索引传递到setTimeout延迟来执行此操作：

var allButtons = $(":button");
for (i = 0; i < allButtons.length; i++) {
    (function(index) {
        setTimeout(function() { 
            allButtons[index].focus(); 
        }, 1000*index);
    }(i));
}

See example here.

Answer 2

您可以使用setTimeout在延迟后调用函数。该功能可以将焦点设置在下一个按钮上。

所以伪代码 -

setTimeout(2000, focusOn(0));

// somewhere else
function focusOn(i) {
    $('.category_button')[i].focus();
    if (i + 1 < numButtons)
    {
        setTimeout(2000, focusOn(i + 1);
    }
}

Answer 3

var currentButtonIndex = 0;

function FocusButton()
{
   // focus current button index here
   // increment counter
   // some condition when to stop 
   // call FocusButton again with delay
   // window.setTimeout(FocusButton,1000);
}

如何在jquery中延迟焦点事件？

3 个答案: