更新 $(window).on('load', function () for jQuery v3+ | Firefox 问题

如何解决更新 $(window).on('load', function () for jQuery v3+ | Firefox 问题

想知道如何/应该更新此 jQuery 脚本以符合 jQuery v.3+？此脚本从我们的主要内容包装器中添加和删除一个类，我们使用 CSS 不透明度和过渡在页面加载和过渡时创建优雅的淡出和淡入。

已经工作多年，但 wordpress 将 jQuery 从 1.12.x 更新到 3.5.x，现在它完全随机地不会在 Firefox 中删除加载类（其他浏览器似乎没有挣扎）。我无法弄清楚它何时发生的模式，它只是随机的并且在不同的页面上。这会使页面内容不可见（不透明度：0 = 不理想）。

我们得到的错误是：“jQuery(window).on('load'...) 在加载事件发生后调用”...

jQuery( document ).ready(function( $ ) {
// All of our other functions... 

 // Remove .fade-out class from content wrapper after page loads
 $(window).on('load',function () {
    $("#content-wrap").removeClass("fade-out");
});  

window.addEventListener("pageshow",function() {
    $("#content-wrap").removeClass("fade-out");
},false);


// Add .fade-out class to content before page unloads
window.addEventListener("beforeunload",function () {
  $("#content-wrap").addClass("fade-out");
});

});

================

这是我根据最初的评论尝试进行修复的尝试（希望这是正确的呈现方式）：

(function( $ ) {
// Remove .fade-out class from content wrap after page loads
 $(window).on("load",false);
}( jQuery ));

jQuery( document ).ready(function( $ ) {
// All of our other functions... 

// Add .fade-out class to content before page unloads
window.addEventListener("beforeunload",function () {
  $("#content-wrap").addClass("fade-out");
});

});

关于修复的其他问题：

• 这是正确的语法吗（抱歉，还不是 JS 专家）？

• 此解决方案是否存在在页面内容（例如图像）完成加载之前删除 .fade-out 的可能性？让页面淡入，然后其他图像弹出来有点不太优雅。

• 原始代码在 jQuery 1.x 上运行良好，但在 jQuery 3.x 上偶尔失败的原因是否有任何已知原因？并且只在 Firefox 上失败？？