如果这个问题已经被回答了,我很抱歉。我试着寻找解决方案,但找不到任何适合我代码的解决方案。我对jQuery还是个新手。
我有两种不同类型的粘滞菜单,分别用于两个不同的页面。
$(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:Cannot read property 'top' of undefined”。事实上,第二行下面的其他jQuery代码根本不起作用,除非它们被放在第二行上面。
经过一番研究,我认为问题是$('.content-nav').offset().top
找不到指定的选择器,因为它在不同的页面上。如果是这样,我找不到解决方案。
9条答案
按热度按时间4c8rllxm1#
在尝试获取偏移量之前,检查jQuery对象是否包含任何元素:
字符串
r1zk6ea12#
您的文件不包含任何具有
content-nav
类别的元素,因此方法.offset()
会传回 undefined,而实际上并没有top
属性。您可以在this fiddle中亲自查看
字符串
(you将看到“未定义”)
为了避免整个代码崩溃,您可以使用以下代码:
型
Updated fiddle的一个。
zyfwsgd63#
你最有可能遇到的问题是,在页面的某个地方有一个链接到一个不存在的锚。例如,假设你有以下情况:
字符串
页面中必须有一个元素具有该id,例如:
型
因此,请确保每个链接都与页面中相应的锚相匹配。
y1aodyip4#
我知道这是非常古老的,但我明白这种错误类型是初学者的常见错误,因为大多数初学者都会在加载头元素时调用他们的函数。鉴于此解决方案在此线程中根本没有解决,我将添加它。很可能此JavaScript函数放置在实际html加载之前。记住,如果你在文档准备好之前立即调用你的JavaScript,那么需要来自文档的元素的元素可能会找到一个未定义的值。
c7rzv4ha5#
我遇到了类似的问题,发现我试图获取页脚的偏移量,但我在页脚之前的div中加载了我的脚本。它是这样的:
字符串
所以,问题是,我在加载页脚之前就调用了页脚元素。
我把我的脚本推到页脚下面**,它工作得很好!
wfveoks06#
如果每当您单击
<a>
标记时出现此错误。请尝试下面的代码。正确:
字符串
出现此故障是因为您的
<a>
标签中的href设置为#。基本上,您的应用程序正在尝试查找不存在的href。设置空href的正确方法如上所示。错误:
型
jq6vz3qz7#
我遇到了同样的问题(“未捕获的类型错误:无法读取未定义的属性'top'”)
我尝试了我能找到的所有解决方案,但没有任何帮助。但后来我发现我的DIV有两个ID。
所以,我删除了第二个ID,它起作用了。
我只是希望有人告诉我早点检查我的身份证))
ca1c2owp8#
在我的情况下,我发现了一个奇怪的问题,我使用此功能自动滚动到最后一条评论时,由用户发布,实际上,我在不同的页面添加了相同的功能两次,当激活它的一个页面,并在其他问题发生禁用它,当激活它在两个页面的功能成功通过.
好奇怪:(
dfty9e199#
Mi error era que aquía decía diferente el nombre que había declarado佩罗说,我的编辑错误。
<section id="portafolio" class="portafolio">
tenía otro nombre el id y la class porque aún yo no lo había editado entonces por ello me salía el error,帕拉