如何在不点击的情况下，每隔几秒执行一次代码，在点击的情况下，直接执行代码？

[loje]

在不点击的情况下，每隔几秒隐藏当前DIV,显示下一个DIV，并开始下一个DIV的倒计时
例如在不点击的情况下，5秒后pager1设置为display:none;，并且pager2设置为display:block;，同时pager2开始5秒倒计时（但并非每次倒计时都是5秒，也有可能下一个是6秒倒计时，下下个是10秒倒计时）
然后在点击的情况下，清除当前（就是被设置为display:none;的）DIV的定时器，立即将pager1设置为display:none;，并且pager2设置为display:block;，同时pager2开始5秒倒计时
<div id="pager1">
<button id="next1">下一题</button>
</div>
<div id="pager2" style="display:none;">
<button id="next2">下一题</button>
</div>
<div id="pager3" style="display:none;">
<button id="next3">下一题</button>
</div>
<div id="pager4" style="display:none;">
<button id="next4">下一题</button>
</div>
<div id="pager5" style="display:none;">
<button id="next5">下一题</button>
</div>
<div id="pager6" style="display:none;">
<button id="next6">下一题</button>
</div>
PS.我知道可以用setTimeout来延迟，也知道可以用clearTimeout来清除定时器。
烦请大神指教。

[ajan]

不是还有 setInterval 么？

[Axurez]

可以看看 RxJS

[loje]

@ajan 但是中间会有随机的点击事件终结上一轮的计时，同时开始下一轮的计时，setInterval可以实现吗？

[loje]

@Axurez 不懂RxJS……

[hronro]

@loje 可以的，点击时用clearInterval将之前的计时清空就行，点击结束的时候再重新开setInterval