单击时停止 JavaScript 中的自动制表符切换

Stop auto tab switching in javascript on click

本文关键字：制表符 JavaScript 单击      更新时间：2023-09-26

我发现这篇文章对我需要做的事情很有帮助，那就是使用JavaScript进行带有选项卡和tab_container的幻灯片。 代码效果很好：

javascript 或 jquery 中的自动制表符切换

但是，我希望它做的是，如果您让页面运行，它会在选项卡之间不断旋转。 但是，如果手动单击选项卡（例如，他们想要阅读该选项卡上的内容），则会在该网页上的持续时间内停止选项卡的自动旋转。 如果页面已刷新，或者他们返回到页面，它将再次启动选项卡旋转。

我不确定我可以添加到上面示例中的 Javascript 代码以使自动旋转停止。

提前感谢您的帮助！

您可以使用

clearInterval来阻止setInterval函数运行。 setInterval返回一个 ID，您可以将该 ID 传递给clearInterval以停止它，例如

var intervalID = setInterval(function() {
    ....
clearInterval(intervalID);

所以只需制作代码

var intervalID = setInterval(function() {
    ....
tabs.on('click', 'a', function(e) {
    clearInterval(intervalID);
    $(this).trigger('slides.swap');
    e.preventDefault();
});

我还将setInterval函数从触发click更改为直接触发slides.swap，以便您知道触发click和用户点击之间的区别：

$('a:eq('+idx+')').trigger('slides.swap');

这是这个问题的更新小提琴。

相关文章：