Javascript 等待JQuery执行，直到整个页面加载并中断执行

我有一个JQuery脚本，在用户使用JQuery.scroll/.scrollTop函数向下滚动一定数量的像素后，加载新闻稿订阅弹出窗口

目前，这一切都被封装在

jQuery(document).ready(function($)

问题是通常的缓存和图像问题，订阅框会到处弹出。我读过关于使用.load函数延迟jQuery直到页面完全加载的文章。但是当我替换

jQuery(document).ready

与

功能完全中断

我想指出的是，我正在使用WordPress，并将脚本按如下方式排队：

function enfold_child_custom_scripts(){

    // Register and Enqueue a Script
    // get_stylesheet_directory_uri will look up child theme location
    wp_register_script( 'custom-js', get_stylesheet_directory_uri() . '/custom.js', array('jquery'));
    wp_enqueue_script( 'custom-js' );

}

add_action('wp_enqueue_scripts', 'enfold_child_custom_scripts');

这是我的JS/jQuery代码

jQuery(document).ready(function($) {

    jQuery("#nl-pop").hide(); //hide nl block initially
    var disableFade = "false";

    var startShowTop = jQuery("#newsletter-cta").offset().top - 3500;
    var startHide = jQuery("#newsletter-cta").offset().top - jQuery(window).height(); //Hide when the viewport is reached

    jQuery('#no-thanks').click(function(event) {
         event.preventDefault();
         jQuery('#nl-pop').fadeOut('slow');
         disableFade = "true";
    }); 
 jQuery(window).scroll(function() {
        if(jQuery(window).scrollTop() < (startShowTop) ) //when scrollposition is smaller than the first point
        {
             jQuery("#nl-pop").fadeOut(200); // Hide when in the upper part of the page
        }
        else //when reached the lower part of the page
        {
            if(jQuery(window).scrollTop() > startShowTop && $(window).scrollTop() < startHide && disableFade==="false") { //When reached the show position but not as far down as the hide position
                jQuery("#nl-pop").fadeIn(200); //show
            }

            else if(jQuery(window).scrollTop() > (startHide) ) { //scrolled down to the bottom newsletter box
                jQuery("#nl-pop").fadeOut(200); //hide
            }
        } 

    });   
});

jQuery（文档）.ready（函数（$）{
jQuery（“#nl pop”）.hide（）；//最初隐藏nl块
var disableFade=“false”；
var startShowTop=jQuery（“#时事通讯cta”）.offset（）.top-3500；
var startHide=jQuery（“#时事通讯cta”）.offset（）.top-jQuery（window.height（）；//到达视口时隐藏
jQuery（“#不，谢谢”）。单击（函数（事件）{
event.preventDefault（）；
jQuery（“#nl pop”）.fadeOut（'slow'）；
disableFade=“true”；
}); 
jQuery（窗口）.滚动（函数（）{
if（jQuery（window）.scrollTop（）<（startShowTop））//当scrollposition小于第一个点时
{
jQuery（“#nl pop”）.fadeOut（200）；//在页面上部时隐藏
}
else//到达页面的下半部分时
{
如果（jQuery（window）.scrollTop（）>startShowTop&&$（window）.scrollTop（）（startHide））{//向下滚动到底部的新闻通讯框
jQuery（“#nl pop”）.fadeOut（200）；//隐藏
}
} 
});   
});

将

开始显示顶

和

开始显示顶

的计算移动到

.scroll（）的内部。这样，它们的值就不会受到卸载元素的影响。相反，它们将取决于页面的当前状态（很可能是在整个页面加载之后）。
您已经将
$
传递到
ready
语句中。在
ready
块中使用
$
代替
jQuery
是安全的。注意：对于函数
enfold\u child\u custom\u scripts（）
，您不需要再使用wp\u register\u script（），因为现在它已合并到wp\u enqueue\u script（）中。您可以仅用一行替换这两行：
wp\u enqueue\u脚本（'custom js'，get\u stylesheet\u directory\u uri（）。/custom.js'，array（'jquery'）。
jQuery(document).ready(function($) {

    jQuery("#nl-pop").hide(); //hide nl block initially
    var disableFade = "false";

    var startShowTop = jQuery("#newsletter-cta").offset().top - 3500;
    var startHide = jQuery("#newsletter-cta").offset().top - jQuery(window).height(); //Hide when the viewport is reached

    jQuery('#no-thanks').click(function(event) {
         event.preventDefault();
         jQuery('#nl-pop').fadeOut('slow');
         disableFade = "true";
    }); 
 jQuery(window).scroll(function() {
        if(jQuery(window).scrollTop() < (startShowTop) ) //when scrollposition is smaller than the first point
        {
             jQuery("#nl-pop").fadeOut(200); // Hide when in the upper part of the page
        }
        else //when reached the lower part of the page
        {
            if(jQuery(window).scrollTop() > startShowTop && $(window).scrollTop() < startHide && disableFade==="false") { //When reached the show position but not as far down as the hide position
                jQuery("#nl-pop").fadeIn(200); //show
            }

            else if(jQuery(window).scrollTop() > (startHide) ) { //scrolled down to the bottom newsletter box
                jQuery("#nl-pop").fadeOut(200); //hide
            }
        } 

    });   
});