Javascript 如何使Jquery setTimeout（）函数在swup或其他库中的页面转换后工作？

我有一个

index.html

，带有一些使用

setTimeout

函数的动画，还有一个指向

about.html

的链接。 我正在使用

swup

进行页面转换。但是当我转到

about.html

时，我会回到

index.html

什么也没发生。因为

setTimeout

不再工作。 是否有任何方法可以使

setTimeout

即使在页面转换之后也能工作

这是我的

js

代码：

//page transition using swup
const swup = new Swup();
$(document).ready(function () {
$(document).on("click", ".link a", function (e) {
    $(this).parent().addClass("active");
    $(this).parent().siblings().removeClass("active");
});
const textSpans = document.querySelectorAll(".my-text span");
textSpans.forEach(span => span.addEventListener('mouseenter', function (e) {
    span.classList.add('animated', 'rubberBand')
}))
textSpans.forEach(span => span.addEventListener('mouseleave', function (e) {
    setTimeout(() => {
        span.classList.remove('animated', 'rubberBand');
    }, 500);
}))
setInterval(() => {
    delay = 0;
    $(".my-text span").each(function (index, element) {
        setTimeout(() => {
            $(element).addClass("animated pulse");
        }, delay);
        delay += 40;
        setTimeout(() => {
            $(element).removeClass("animated pulse");
        }, 1800);
    });
}, 3000);
delay = 0;
$(".laptop-codes span").each(function (i, elem) {
    setTimeout(() => {
        $(elem).css("display", "initial");
    }, delay);
    delay += 20;
});
setTimeout(() => {
    $(".key-buttons .enter-key").css("background", "#ff5722");
    setTimeout(() => {
        $(".key-buttons .enter-key").css("background", "#38384b55");
        $(".laptop-con").addClass("laptop-transform");
    }, 100);
}, 2200);
setTimeout(() => {
    $(".my-text").fadeIn(3000);
}, 3000);
setTimeout(() => {
    $(".laptop-con .laptop-icon").css("transform", "rotate(-15deg)");
}, 3500);
$(document).on("click", ".key-buttons p", function (e) {
    e.preventDefault();
    $(".laptop-con .laptop-icon").toggleClass("laptop-rotate");
});
});