修改

Question

所以我现在有这个代码：

$(document).ready(function(){
$window = $(window),
$sidebar = $(".sidebar"),
sidebarTop = $sidebar.position().top,
sidebarHeight = $sidebar.height(),
$footer = $(".footer"),
footerTop = $footer.position().top,    
$sidebar.addClass('fixed');

$window.scroll(function(event) {
    scrollTop = $window.scrollTop(),
    topPosition = Math.max(0, sidebarTop - scrollTop),
    topPosition = Math.min(topPosition, (footerTop - scrollTop) - sidebarHeight);
    $sidebar.css('top', topPosition);
});
});

这产生了未捕获的TypeError：无法读取属性'top'为null

我还是jQuery的新手，但我猜这是因为.sidebar还没有在页面上，它是外部html文件中的一个div，它通过AJAX注入。

我想我需要更改$（document）.ready（function（）{line，以便在.sidebar实际上在页面上时抓取变量，但我真的不知道如何做到这一点。我一直在使用.on（）方法，但还没有运气。

任何帮助都会非常感激！

谢谢！

修改

使用此更新代码：

$(document).ready(function(){

    $(window).scroll(function(event) {
        var $sidebar = $('.sidebar'),
            sidebarTop = $sidebar.position().top,
            sidebarHeight = $sidebar.height(),
            $footer = $('#footer'),
            footerTop = $footer.position().top,    
            $sidebar.addClass("fixed");

        scrollTop = $(window).scrollTop(),
        topPosition = Math.max(0, sidebarTop - scrollTop),
        topPosition = Math.min(topPosition, (footerTop - scrollTop) - sidebarHeight);
        $sidebar.css('top', topPosition);
});
});

我现在在$ sidebar.addClass（“fixed”）下得到 Uncaught SyntaxError：Unexpected Identifier ;线。

这意味着$ sidebar被声明了？但它是！？正确？

任何帮助人员，这让我疯了！

编辑2：

再次更新了代码，得到了一个错误，窗口var未定义，因此使得global：

$(document).ready(function(){
$window = $(window);

$window.scroll(function(event) {
    var $sidebar = $(".sidebar"),
        sidebarTop = $sidebar.position().top,
        sidebarHeight = $sidebar.height(),
        $footer = $("#footer"),
        footerTop = $footer.position().top;    

    $sidebar.addClass('fixed');
    scrollTop = $window.scrollTop(),
    topPosition = Math.max(0, sidebarTop - scrollTop),
    topPosition = Math.min(topPosition, (footerTop - scrollTop) - sidebarHeight);
    $sidebar.css('top', topPosition);
});

});

但是现在.sidebar有一个常量 style =“top：-370px; 附加到它。

任何？哈哈......啊！

Answer 1

首先，您应该使用var关键字声明变量，否则它们将被添加到全局范围。

其次，如果您将$sidebar选择器和所有其他变量放在滚动函数中，那么它将在滚动时进行选择，而不是仅在文档加载时进行一次。因此，如果边栏在用户滚动时可用，那么一切都应该正常运行。

基本上，它应该是这样的：

$(document).ready(function(){

    $window.scroll(function(event) {
        var $window = $(window),
            $sidebar = $(".sidebar"),
            sidebarTop = $sidebar.position().top,
            sidebarHeight = $sidebar.height(),
            $footer = $(".footer"),
            footerTop = $footer.position().top;    

        $sidebar.addClass('fixed');
        scrollTop = $window.scrollTop(),
        topPosition = Math.max(0, sidebarTop - scrollTop),
        topPosition = Math.min(topPosition, (footerTop - scrollTop) - sidebarHeight);
        $sidebar.css('top', topPosition);
    });

});

声明一个不在页面上的变量但是错误

修改

编辑2：

1 个答案: