javascript - jQuery 按时间间隔单击各个元素

Question

我正在使用 JQVMap 在页面上渲染世界地图。我需要按照特定顺序每 10 秒自动单击一个单独的 map 区域。到目前为止，这是我的 JavaScript:

//get each region in the sequence
var asiaID = document.getElementById('jqvmap1_cn'); //China
var americaID = document.getElementById('jqvmap1_ar'); //Argentina
var africaID = document.getElementById('jqvmap1_et'); //Ethiopia
var europeID = document.getElementById('jqvmap1_ru'); //Russia
var eastID = document.getElementById('jqvmap1_pk'); //Pakistan

var regionArray = [asiaID, americaID, africaID, europeID, eastID];
var arrayLength = regionArray.length;

//trigger sequence on time interval
setInterval(autoCycle, 10000);

//cycle through each region with click
function autoCycle(){
    //loop through each region
    for (var i = 0; i < arrayLength; i++) {
        jQuery(regionArray[i]).trigger('click');
        console.log(regionArray[i]);
    }
}

使用此代码，regionArray 中的所有区域每 10 秒同时单击一次。如果有意义的话，我需要按顺序单独单击它们。 for() 循环对此不起作用吗？

Answer 1

您可以使用以下逻辑:

var i = 0;
setInterval(function(){autoCycle(i++%arrayLength)}, 10000);

//cycle through each region with click
function autoCycle(i) {
    jQuery(regionArray[i]).trigger('click');   
}