javascript - jQuery 脚本已加载但没有任何反应

Question

我正在使用此脚本(遵循视频教程)，但没有任何反应，也没有错误:

$(document).ready(function () {

var scrollTop = $(window).scrollTop();
var windowSize = $(window).height();
var appart = 50;

display(scrollTop, windowSize);

$(window).resize(function(){
    var windowSize = $(window).height();
});

$(window).scroll(function(){
    var scrollTop = $(window).scrollTop();
    display(scrollTop, windowSize);
});

function display(scrollTop, windowSize){

    $('.wp-post-image').each(function(){

        var elemTop = $(this).offset().top;

        if($(this).css('opacity') === 0 && (parseInt(elemTop) <= parseInt(scrollTop + windowSize - appart))){

            $(this).fadeTo(2000,1);

        }   

    }); 

}   

});

它应该在页面上滚动时显示带有过渡的内容(如延迟加载)。

我正在使用 wordpress。

我真的不明白为什么它不起作用。谢谢。

Answer 1

取自 this page WordPress 法典:

The jQuery library included with WordPress is set to use the noConflict() mode to prevent compatibility issues with other JavaScript libraries that WordPress can use.

In the noConflict() mode, the global $ shortcut for jQuery is not available, so you need to use:

jQuery(document).ready(function(){
    jQuery(#somefunction) ...
});

However, if you would prefer to use the short $ instead of jQuery, you can use the following wrapper around your code:

jQuery(document).ready(function($) {
    // Inside of this function, $() will work as an alias for jQuery()
    // and other libraries also using $ will not be accessible under this shortcut
});

希望有帮助。