javascript - 如何在列表中的按钮上按间隔进行触发点击

Question

我有一个带有按钮的列表。我想按顺序对每个按钮进行间隔触发，如果达到最后一个间隔，它会再次开始。

setInterval(function() {
  $('button').trigger('click');
}, 5000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li><button></button></li>
  <li><button></button></li>
  <li><button></button></li>
  <li><button></button></li>
  <li><button></button></li>
</ul>

Answer 1

要实现这一点，您只需要一个变量来跟踪应单击哪个按钮，然后使用 eq() 按索引选择 button:

let index = 0, $buttons = $('button');

setInterval(function() {
  $buttons.eq(index % $buttons.length).trigger('click');
  index++;
}, 1000);

// to test:
$('button').on('click', function(i) {
  console.log(`Button ${this.id} was clicked`);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul>
  <li><button id="1"></button></li>
  <li><button id="2"></button></li>
  <li><button id="3"></button></li>
  <li><button id="4"></button></li>
  <li><button id="5"></button></li>
</ul>

值得注意的是，触发 click 事件不一定是实现您所需的最佳方法。我建议直接调用一个函数。