每次单击链接时都会出现脚本错误

Question

我的网站上一切都很正常，但由于某种原因，每当我点击网站上的任何链接时，我都会在控制台中收到错误消息。错误与这里的代码行有关：

jQuery(function($){
$('.navbar a, .scroll a, .smoothscroll a').bind('click',function(event){
var $anchor = $(this);
$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 850,'easeInOutExpo');
event.preventDefault();
});
});

我得到的错误是：

"SCRIPT5007:无法获取属性'top'的值：对象为null或未定义custom.min.js，第6行，字符197">

它强调的确切代码是上面代码的这一部分：

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 850,'easeInOutExpo')

我所知道的是，当我删除上面的代码时，我的滚动链接将停止在以下页面上工作：

http://www.northtownsremodeling.com/things-to-know.php

你可以看到弹出错误的发生，并停留在控制台很容易进入一个页面，过滤器如下：

http://www.northtownsremodeling.com/bathroom/

然后单击其中一个筛选器按钮。

最终，我正在努力让我的滚动设置仍然有效，但不再出现错误。我很久以前就制作了这个脚本，我真的很困惑，当一切都正常运行时，是什么导致了这个错误？

谢谢！

Answer 1

您遇到的问题是，出现错误的代码是滚动到预定义的div，并且它的id(目标div的id)位于url的标签中(单击链接的href属性)。

当你点击"正常"链接时，这是个问题，因为它不包含标签，标签是页面上现有元素的id，所以$($anchor.attr('href'))给出了空数组，因为没有这样的元素可以用$("http://www.northtownsremodeling.com/alliances.php")来选择，所以在这种情况下，offset()是未定义的，并给你一个错误。

要解决此问题，请替换：

$('html, body').stop().animate({
scrollTop: $($anchor.attr('href')).offset().top
}, 850,'easeInOutExpo');

带有：

// get target div to scroll to
var target = $($anchor.attr('href'));
// if target is valid, scroll to
if(target && target.offset()){
$('html, body').stop().animate({
scrollTop: target.offset().top
}, 850,'easeInOutExpo');
}

Answer 2

演示：http://jsfiddle.net/SWgYD/

我认为这是因为href属性不包含正确的选择器。如果链路符合id为nav的块，则链路的href属性应为#nav。

您应该仅将事件处理程序绑定到导航链接。