如果 window.onload 不是当前选项卡，为什么不触发？

Question

我的主页上有 href 属性（另一页）。如果我点击另一个页面的加载功能，它就可以正常工作。如果我使用（control + 左键单击 link）或（右键单击 -> 在新选项卡中打开），如果它不是我的活动或当前选项卡，则不会触发加载功能。如果我立即切换到该特定选项卡，它会像往常一样正常工作。我的问题是，如果它不是我们当前的选项卡，它会不会工作。任何替代解决方案。谢谢

 window.onload = swipe();         
            function swipe() {              
              
                if (window.outerWidth > 1024) {

                    var slider = document.getElementsByClassName("cards")[0];
                    var isDown = false;
                    var startX;
                    var scrollLeft;
                    slider.addEventListener('mousedown', function (e) {
                        isDown = true;
                        startX = e.pageX - slider.offsetLeft;
                        scrollLeft = slider.scrollLeft;
                        e.preventDefault();
                    });
                    slider.addEventListener('mouseleave', function () {
                        isDown = false;
                    });
                    slider.addEventListener('mouseup', function () {
                        isDown = false;
                    });
                    slider.addEventListener('mousemove', function (e) {
                        if (!isDown) return;
                        e.preventDefault();
                        var x = e.pageX - slider.offsetLeft;
                        var walk = (x - startX) * 3;

                        slider.scrollLeft = scrollLeft - walk;
                    });
                }

                var swipe_sec = document.getElementsByClassName("cards")[0];

                function calc_prog(winScroll, width) {
                    var scrolled = ((winScroll) / width) * 100;
                    document.getElementById("t_art_prog").style.width = scrolled + "%";

                }

                var winScroll = swipe_sec.clientWidth;
                var width = swipe_sec.scrollWidth - swipe_sec.clientWidth;
                calc_prog(winScroll, width);

                swipe_sec.addEventListener("scroll", function () {
                    var winScroll = swipe_sec.scrollLeft + swipe_sec.clientWidth;
                    var width = swipe_sec.scrollWidth;
                    calc_prog(winScroll, width);
                });
            }

Answer 1

问题不在于 window.onload，而是 if (window.outerWidth > 1024)，当您在新选项卡中打开时，window.outerWidth 将为 0。

我能想到的两个解决方案 -

使用window.visualViewport.width代替window.outerWidth
试试这样使用焦点事件 -

window.addEventListener('focus', 函数(){ ... });

注意-每次切换tab都会触发focus事件，需要控制只执行一次

如果 window.onload 不是当前选项卡，为什么不触发？

Why window.onload is not firing if it is not a current tab?

javascript

event-handling

onload-event