Uncaught TypeError:无法读取未定义的属性'top'

如果这个问题已经被回答,我很抱歉。 我试图寻找解决scheme,但无法find任何适合我的代码。 我还是新来的jQuery。

对于两个不同的页面,我有两种不同types的粘性菜单。 这是两个代码。

$(document).ready(function () { var contentNav = $('.content-nav').offset().top; var stickyNav = function () { var scrollTop = $(window).scrollTop(); if (scrollTop > contentNav) { $('.content-nav').addClass('content-nav-sticky'); } else {; $('.content-nav').removeClass('content-nav-sticky') } }; stickyNav(); $(window).scroll(function () { stickyNav(); }); }); $(document).ready(function () { var stickyNavTop = $('.nav-map').offset().top; // var contentNav = $('.content-nav').offset().top; var stickyNav = function () { var scrollTop = $(window).scrollTop(); if (scrollTop > stickyNavTop) { $('.nav-map').addClass('sticky'); // $('.content-nav').addClass('sticky'); } else { $('.nav-map').removeClass('sticky'); // $('.content-nav').removeClass('sticky') } }; stickyNav(); $(window).scroll(function () { stickyNav(); }); }); 

我的问题是底部粘性侧菜单的代码不工作,因为第二行代码var contentNav = $('.content-nav').offset().top; 会触发一个错误,读取“Uncaught TypeError:无法读取未定义的属性”顶部“。 事实上,除了第二行以外的其他jQuery代码,除非它们位于其上方,否则不会运行。

经过一番研究,我认为问题在于$('.content-nav').offset().top找不到指定的select器,因为它位于不同的页面上。 如果是这样,我找不到解决scheme。

检查jQuery对象是否包含任何元素,然后尝试获取其偏移量:

 var nav = $('.content-nav'); if (nav.length) { var contentNav = nav.offset().top; ...continue to set up the menu } 

您的文档不包含任何类content-nav元素,因此方法.offset()返回undefined ,它确实没有top属性。

你可以在这个小提琴里看到自己

 alert($('.content-nav').offset()); 

(你会看到“未定义”)

为了避免崩溃整个代码,你可以使用这样的代码:

 var top = ($('.content-nav').offset() || { "top": NaN }).top; if (isNaN(top)) { alert("something is wrong, no top"); } else { alert(top); } 

更新小提琴 。

我知道这是非常古老的,但我明白,这种错误types是初学者常犯的错误,因为大多数初学者将调用他们的function在他们的头元素被加载。 看到这个解决scheme根本没有解决这个线程,我会添加它。 这个javascript函数很可能在实际的html被加载之前被放置 。 请记住,如果在文档准备就绪之前立即调用JavaScript,那么需要文档中元素的元素可能会find未定义的值。

您最可能遇到的问题是,页面中某处存在链接不存在的链接。 例如,假设你有以下几点:

 <a href="#examples">Skip to examples</a> 

页面中必须有该元素,例如:

 <div id="examples">Here are the examples</div> 

因此,确保每个链接都与页面内的相应锚点匹配。

我有同样的问题(“Uncaught TypeError:无法读取未定义的属性'顶部')

我尝试了我能find的所有解决scheme,并注意到了帮助。 但后来我发现我的DIV有两个ID。

所以,我删除了第二个ID,它的工作。

我只希望有人告诉我以前检查我的ID))