jQuery什么都不做

Question

我有這個jQuery，在頁面上滾動后應該“插入”標題，但是什么也沒有發生。 在第三行，我的代碼編輯器給我一個！只讀警報，也許語法有問題？

我正在使用自動調用jQuery的beaver構建器。

$( document ).ready(function() {
        $(window).scroll(function(){
            scroll = $(window).scrollTop();
            if (scroll > 450){
                $('#jQuery-mob').slideDown();
            }

            if (scroll < 450){
                $('#jQuery-mob').slideUp();
            }

        });
    });

        $( document ).ready(function() {
        $(window).scroll(function(){
            scroll = $(window).scrollTop();
            if (scroll > 700){
                $('#why-jquery').slideDown();
            }

            if (scroll < 700){
                $('#why-jquery').slideUp();
            }

        });
    });

＃jquery-mob和＃why-jquery都設置為顯示：無

CSS：

    #why-jquery {
    position: fixed;
    top:0;
    z-index: 99;
    width: 100%;
    height: 100px;
    display: none;
}

#jQuery-mob {
    position: fixed;
    top:0;
    z-index: 99;
    width: 100%;
    height: 100px;
    padding: 0 !important;
    display: none;
}

Answer 1

我正在使用自動調用jQuery的beaver構建器。

我想你的意思是說：

我正在使用wordpress，它會自動調用jQuery。

對於wordpress網站，默認情況下，您必須使用jQuery而不是$ 。 您可以全部替換，也可以只在.ready“包裝器”中使用jQuery，然后將$傳遞給.ready函數。

兩者的示例：

jQuery( document ).ready(function() {
    jQuery(window).scroll(function(){
        scroll = jQuery(window).scrollTop();
        if (scroll > 450){
            jQuery('#jQuery-mob').slideDown();
        }

        if (scroll < 450){
            jQuery('#jQuery-mob').slideUp();
        }
    });
});

jQuery(document).ready(function(  $  ) {
    $(window).scroll(function(){
        scroll = $(window).scrollTop();
        if (scroll > 700){
            $('#why-jquery').slideDown();
        }

        if (scroll < 700){
            $('#why-jquery').slideUp();
        }
    });
});

請注意，我沒有檢查您的代碼，但確實看到您使用的是scroll而不用var聲明。 這意味着scroll將是一個全局變量。 設置/使用這兩個函數可能會相互干擾，並覆蓋window.scroll函數。 您可能要使用var scroll=等，還最好使用另一個變量名。

Answer 2

scroll是窗口級的功能，因此在瀏覽器上下文中充當保留字 ：

 console.log(scroll) 

您正在嘗試使用名為“ scroll”的變量覆蓋它，這就是導致您看到的“！readonly”錯誤的原因。

使用其他變量名（並使用'var'聲明。）

Answer 3

此代碼有邏輯問題

  if (scroll < 450 && scroll < 800){ 

當滾動小於450時，它也小於800，那么為什么還要包含第二個比較？

這條線上的故事相同：

if (scroll < 700 && scroll < 1000){