如何在jquery中延遲焦點事件？

Question

我的頁面上有幾個按鈕，我想用一定的延遲將焦點對準每個按鈕。我如何用jQuery或純JavaScript實現這一點。這是我對所有按鈕進行迭代的想法，但我顯然最終關注了最後一個按鈕。

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

Answer 1

您可以爲您的循環中創建一個封閉並通過索引到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); 
}