Javascript jQuery粘性边栏失败

首先，我没有写这段代码。我是在别人的网站上找到的，我想通过自己尝试来学习。但是我不能让它工作。我已经在谷歌上搜索了代码，以防它是一个免费提供的jQuery插件或任何东西，但我在网上的任何地方都找不到它

我有我的侧边栏（id为#侧边栏），并给它一个“sticky”类，我在页面顶部包含了jQuery，并且我在头部放置了以下代码：

<!-- Floating sidebar jQuery --> 
        <script type="text/javascript"> 
            var Sticky = function( $obj, opts ){

               $(window).scroll( 
                  function(e){
                     Sticky.onScroll(e, $obj, opts );
                  });

            }
            Sticky.onScroll = function( e, $o, opts ){

               var iScrollTop = $(window).scrollTop();
               var sClass = "sticky";

               //set original data
               if( !$o.data(sClass) ){
                  $o.data(sClass, {css:{position:$o.css('position'),top:$o.css('top')}, offset:$o.offset()} );
               }
               var oOrig = $o.data(sClass);
               var bIsSticky = $o.hasClass(sClass);

               if( iScrollTop > oOrig.offset.top && !bIsSticky ){
                  $o.css({position:'fixed',top:0}).addClass(sClass);
               }else if(iScrollTop < oOrig.offset.top && bIsSticky){
                  $o.css(oOrig.css).removeClass(sClass);
               }   

            }

            Sticky( $('#sidebar') );

        </script> 

var Sticky=函数（$obj，opts）{
$（窗口）。滚动（
职能（e）{
Sticky.onScroll（e$obj，opts）；
});
}
Sticky.onScroll=函数（e、$o、opts）{
var iScrollTop=$（window.scrollTop（）；
var sClass=“粘性”；
//设置原始数据
如果（！$o.data（sClass））{
$o.data（sClass，{css:{position:$o.css（'position'），top:$o.css（'top'）}，offset:$o.offset（）}）；
}
var oOrig=$o.data（sClass）；
var Bisticky=$o.hasClass（sClass）；
如果（iScrollTop>oOrig.offset.top&&！bisticky）{
$o.css（{位置：'fixed'，顶部：0}）；
}else if（iScrollTop

如您所见，最后一行JS

Sticky（$（“#边栏”）在#侧边栏元素上激发。但是，向下滚动时，此错误会写入Chrome的日志：

未捕获的TypeError:无法读取未定义的属性“offset”

Firebug有点冗长，它说：

oOrig未定义：
if（iScrollTop>
oOrig.offset.top&！bisticky）{

我正在尽我最大的努力去理解这一点，但是有人能帮我看看为什么它不起作用吗

谢谢

杰克
哇，新答案……谢谢菲利克斯

将函数调用包装在就绪函数中

$(function() {
    Sticky($('#sidebar'));
});

当您调用
Sticky（$（“#侧边栏”）
时，dom很可能没有准备好，因此当.data用于在
$o
上设置数据时，它实际上不执行任何操作：

$o.data(sClass, {css:{position:$o.css('position'),top:$o.css('top')}, offset:$o.offset()} );].  

因此，当它在线获取数据时：

var oOrig = $o.data(sClass);

它实际上无法获取数据

这是因为dom元素还没有准备好进行操作，因为dom还没有准备好

旧答案（不对！）
$。偏移量是一个函数

$(function() {
    Sticky($('#sidebar'));
});

问题在于：

if( iScrollTop > oOrig.offset.top && !bIsSticky ){

这是：
oOrig.offset
是一个函数，而不是一个变量。因此
oOrig.offset.top
无效。只需调用该函数，它将返回一个具有top属性的变量，您可以访问该变量：

if( iScrollTop > oOrig.offset().top && !bIsSticky ){

解释：

oOrig.offset
是对函数（jquery中的函数）的引用

您必须调用该函数才能访问
.top
属性。
您使用的代码似乎过于复杂。我编写了一个教程，介绍如何实现此功能，该教程应该更易于实现，并且不易出错

我担心这仍然会触发相同的错误，控制台只会给出相同的消息，但在偏移量之后有几个括号！：（编辑：Chrome现在说“Uncaught TypeError:无法调用undefined的“offset”方法）它仍然说oOrig是未定义的。这个答案是错误的。为什么那些投票呢？
offset
不是
oOrig
上的函数。如果仔细看，那么
oOrig
就是存储在
$o.data（sClass）
中的对象，它是
{css:{position o.css（'position'），top:$o.css（'top'）}，offset:$o.offset（）}
。即使它是一个函数，它也会抛出另一个错误，
oOrig
不是未定义的。@Bob：在你所说的
if
语句中，
oOrig.offset
实际上是一个变量。
oOrig
来自
.data（）
，所以它应该是一个普通的旧对象，有3个属性，
css
，
top
，和
offset
。看看
//设置原始数据
注释下面的那一行。在我看来，问题好像是
$o.data（sClass，{/*…*}）
没有正确发生。@Bob Fincheimer:可能发生；）我希望你不会被我之前评论的前两句话所冒犯。我只是想知道为什么人们在没有验证的情况下如此迅速地对听起来合理的答案进行投票。如果你把
console.log（$o.data（sClass））；
放在
var oOrig=$o.data（sClass）之前，结果会是什么；
？我看不到代码中有错误。添加一些
日志调用并检查变量的内容。还要检查
if（！$o.data（sClass））
语句中的代码是否执行。