获取错误"无法读取未定义的属性'top'"

Question

我搜索了这个网站，发现了类似的问题，但没有解决我的问题。当我滚动到一个div时，我试图使它固定在屏幕顶部。但我一直在犯错误：

"（index）： 59未捕获类型错误：无法读取未定义的属性'top'at（index）： 59"

    
    //store the element
    var cache = '.faixatrabalho';
           console.log( cache );
    
    //store the initial position of the element
    var vTop = $(cache).offset().top - parseFloat($cache.css('margin-top').replace(/auto/, 0));
      $(window).scroll(function (event) {
        // what the y position of the scroll is
        var y = $(this).scrollTop();
    
        // whether that's below the form
        if (y >= vTop) {
          // if so, ad the fixed class
          $(cache).addClass('stuck');
        } else {
          // otherwise remove it
          $cache.removeClass('stuck');
        }
      });
    
        </script>
    

    .faixatrabalho {
        padding-top: 20px;
    	width: 100vw;
        position: static;
        top: 0px;
      }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="faixatrabalho">
        
        <div id="trabalhoback" data-scroll-speed="3"></div>
        
    	<div class="titulo">Nosso Trabalho</div>
    	<div class="texto1">
    		<p > Exemple text</p>
    	</div>
    </div>

我还在学习jQuery，不能解决这个问题。

Answer 1

这个错误意味着$（高速缓存）。偏移（）返回的未定义的，在jQuery术语中，这通常意味着$（高速缓存）没有找到任何东西。

从脚本的布局来看，您可能正在立即执行此代码，并且您寻找的元素可能还不存在（因为文档仍在加载中）。尝试在文档完全加载后执行它。在jQuery中，您可以通过包装jQuery函数本身中的代码来实现这一点，默认情况下，jQuery函数将其设置为文档的就绪事件的处理程序：

$(function () {
    var cache = '.faixatrabalho';
    console.log( cache );

    //store the initial position of the element
    var vTop = $(cache).offset().top - parseFloat($cache.css('margin-top').replace(/auto/, 0));
});