1

我在我的基本模板中添加了滚动返回顶部按钮,它运行良好。但是当我转到任何其他页面时,该按钮将不起作用。为什么?!

这是我的基本模板:

<!DOCTYPE html>
<html>
  <head></head>

  <body>
    <button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>
    .
    .
    <div class="container">
      #import("content") 
    </div>
    .
    .
  </body>
</html>

我正在使用上面链接中的 JavaScript:

window.onscroll = function() { scrollFunction() };

function scrollFunction() {
  if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
    $('#myBtn').fadeIn();
  } else {
    $('#myBtn').fadeOut();
  }
}

function topFunction() {
  document.body.scrollTop = 0; // For Safari
  document.documentElement.scrollTop = 0; // For Chrome, Firefox, IE and Opera
}

该按钮仅在主页上有效,但在任何其他页面上均无效,即使我看到(来自查看页面源)<button onclick="topFunction()" id="myBtn" title="Go to top">Top</button>在正文中。有人可以帮忙吗??

4

1 回答 1

0

上面的代码实际上是正确的,并且按钮现在在每个页面上都可以正常工作。在tobygriffin指出之后,我注意到有一个Cannot read property 'style' of undefined我以前没有的错误。修复该错误后,该按钮可在所有页面上运行。

尽管这对我来说是一个愚蠢的错误,但我仍保留此问答(而不是删除它),希望有人会发现它有用:)

于 2018-03-01T21:15:33.373 回答