bootstrap tab页自动刷新相互影响问题

Question

比如 现在 我有两个tab页 tab1和tab2 tab1中设置有定时自动刷新 同时打开两个tab页
如果界面一直停留在tab1 则不会影响tab2 如果界面停留在tab2 但是tab1的自动刷新
还在执行 然后这个tab2 就变为空白了 有没有什么方法判断界面此时停留在某个tab页
或者说 只有让界面停留在tab1时候才执行自动刷新 来个大神 在线等 。。。
。setInterval(function(){
refresh(true)
}, 30000);

这个是刷新用的代码

Answer 1

以下回答参考 皆我百晓生、券券喵儿 等免费微信小程序相关内容作答，并由本人整理回复。

要解决这个问题，你可以使用window.onload事件来检查当前页面是否已经加载完成。这样就可以确保在页面完全加载之前不会触发任何自动刷新操作。以下是一个示例：

<script>
    window.onload = function() {
        if (document.querySelector('#yourTab1Element')) { // Replace 'yourTab1Element' with the actual ID of your first tab
            document.getElementById('yourTab1Element').scrollIntoView();
            setInterval(function(){
                refresh(true);
            }, 30000); // This will be executed every 3 seconds, so you can adjust this to fit your needs.
        }
    };

    function refresh(isFirst) {
        if (!isFirst) {
            document.getElementById('yourTab2Element').style.display = 'block';
        } else {
            document.getElementById('yourTab2Element').style.display = 'none';
        }
    }
</script>

在这个例子中，我们首先等待window.onload事件。然后，我们检查是否有匹配的元素（例如#yourTab1Element）。如果有，我们就滚动到它，并且每3秒执行一次refresh函数。refresh函数会根据isFirst参数决定显示哪个tab。

请注意，你需要将上述HTML代码中的yourTab1Element和yourTab2Element替换为你实际的ID。此外，你可能还需要调整30000毫秒（或3000毫秒）为你的需求，以满足特定的需求。