Javascript平滑滚动-不使用第二次单击

我使用下面的脚本实现平滑滚动效果，在一个页面上减去一定数量的像素。问题是，我点击一个锚链接，滚动效果正常，但我会滚动回链接所在的页面顶部，然后点击另一个页面。它不起作用。我刚从网页上复制了脚本，我的javascript非常糟糕

谢谢你的帮助

function filterPath(string) {
    return string
        .replace(/^\//,'')
        .replace(/(index|default).[a-zA-Z]{3,4}$/,'')
        .replace(/\/$/,'');
    }
    var locationPath = filterPath(location.pathname);
    var scrollElem = scrollableElement('html', 'body');

    $('a[href*=#]').each(function() {
        var thisPath = filterPath(this.pathname) || locationPath;
        if (  locationPath == thisPath
        && (location.hostname == this.hostname || !this.hostname)
        && this.hash.replace(/#/,'') ) {
            var $target = $(this.hash), target = this.hash;
            if (target) {
                var targetOffset = $target.offset().top - 70;
                $(this).click(function(event) {
                if(event != 'undefined') {
                    event.preventDefault();}
                    $(scrollElem).animate({scrollTop: targetOffset}, 400, function(e) {
                    e.preventDefault();
                    location.hash = target;
                });
            });
        }
    }
});

function scrollableElement(els) {
    for (var i = 0, argLength = arguments.length; i <argLength; i++) {
        var el = arguments[i],
            $scrollElement = $(el);
        if ($scrollElement.scrollTop()> 0) {
            return el;
        } else {
            $scrollElement.scrollTop(1);
            var isScrollable = $scrollElement.scrollTop()> 0;
            $scrollElement.scrollTop(0);
            if (isScrollable) {
                return el;
            }
        }
    }
}

函数过滤器路径（字符串）{
返回字符串
.替换（/^\/，''）
.replace（/（索引|默认值）。[a-zA-Z]{3,4}$/，“”）
.替换（/\/$/，''）；
}
var locationPath=filterPath（location.pathname）；
var scrolleem=scrollableElement（'html'，'body'）；
$（'a[href*=#]'）。每个（函数（）{
var thisPath=filterPath（this.pathname）| | locationPath；
如果（locationPath==此路径
&&（location.hostname==this.hostname | |！this.hostname）
&&this.hash.replace（/#/，''）{
var$target=$（this.hash），target=this.hash；
如果（目标）{
var targetOffset=$target.offset（）.top-70；
$（此）。单击（函数（事件）{
如果（事件！=“未定义”）{
event.preventDefault（）；}
$（scrollElem）.animate（{scrollTop:targetOffset}，400，函数（e）{
e、 预防默认值（）；
location.hash=目标；
});
});
}
}
});
函数可滚动元素（els）{
for（var i=0，argLength=arguments.length；i 0）{
返回el；
}否则{
$scrollElement.scrollTop（1）；
变量isScrollable=$scrollElement.scrollTop（）>0；
$scrollElement.scrollTop（0）；
如果（可循环使用）{
返回el；
}
}
}
}

代码中有一个错误

上面写着：

$(scrollElem).animate({scrollTop: targetOffset}, 400, function(e) {
    e.preventDefault();
    location.hash = target;
});

您正在调用

preventDefault（）

，但没有任何结果。保持此状态，它将工作：

$(scrollElem).animate({scrollTop: targetOffset}, 400, function() {
    location.hash = target;
});

---

错误发生在代码的末尾。不要在每个循环中使用

，而应该在锚元素中添加一个
单击
事件。通过使用
each
循环，只需添加一次click事件，因此在第二次单击时，事件为
undefined
，代码会出错

以下是您的代码重写为
单击事件：

$('a[href*=#]').click(function(e){
  var thisPath = filterPath(this.pathname) || locationPath;
  if ( locationPath == thisPath && (location.hostname == this.hostname || !this.hostname) && this.hash.replace(/#/,'') ) {
    var $target = $(this.hash), target = this.hash;
    if (target) {
      var targetOffset = $target.offset().top - 70;
      $(scrollElem).animate({scrollTop: targetOffset}, 400, function() {
        if( e != 'undefined' ) {
          e.preventDefault();
        }
        location.hash = target;
      });
    }
  }
});

希望这有帮助；-）
 你可以粘贴一些你的html吗？不知道你从哪里得到的，但是由于你没有共享任何html，我建议你做一件事，那就是可能尝试使用现有的脚本，比如-看起来很简单。。。