jquery - 如何修复仅在第二次单击时触发的 jQuery 函数？

Question

我有一个 jQuery 函数，当您单击相关的菜单列表项<a/>标记时，它会滚动到 HTML id。问题是，代码仅在您第二次单击时触发。

有任何想法吗？

以下是代码示例：

$(function() {
  // Desired offset, in pixels
  var offset = -87;
  // Desired time to scroll, in milliseconds
  var scrollTime = 500;

  $('#topnav a').click(function() {
    // Need both `html` and `body` for full browser support
    $("html, body").animate({
      scrollTop: $($(this).attr("href")).offset().top + offset
    }, scrollTime);

    // Prevent the jump/flash
    return false;
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="topnav">
  <ul>
    <li><a href="#trustpilot">Our reviews</a></li>
    <li><a href="#about">About us</a></li>
    <li><a href="#what-our-customers-say">What our customers say</a></li>
    <li><a href="#policy">Why check your policy</a></li>
    <li><a class="orange-btn" href="#contact">Book today</a></li>
  </ul>
</div>
<section id="trustpilot">
  <div class="container">
    <div class="row">
      <div class="col-12">
      </div>
    </div>
  </div>
</section>

谢谢，

标签： jquery