Question

 $(document).ready(function(){
  // Add smooth scrolling to all links
  $("a").on('click', function(event) {

    // Make sure this.hash has a value before overriding default behavior
    if (this.hash !== "") {
      // Prevent default anchor click behavior
      event.preventDefault();

      // Store hash
      var hash = this.hash;

      // Using jQuery's animate() method to add smooth page scroll
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 1000, function(){

        // Add hash (#) to URL when done scrolling (default click behavior)
        window.location.hash = none;
      });
    } // End if
  });
});

我正在运行此功能以平滑滚动到＆＃34; #top＆＃34;不改变url-hash。我不小心发现了一种修改方法，以便URL不会更新（添加＆＃34;无＆＃34;对于＆＃34; window.location.hash＆＃34;），但是有＆＃39;一个问题;现在这个功能不会重复。

以下是发生的事情：

加载页面
向下滚动
按顶部锚
页面滚动到顶部（不更新网址）
再次向下滚动
按顶部锚
什么都没发生

不知道我在哪里得到这个片段，但我已经在我的js文件夹中暂时使用了它。

Answer 1

您可以通过两种方式滚动页面。

hash是网址中的#something ...有用以在页面加载时滚动到锚点。

请参阅此链接中的#hello效果：https://codepen.io/Bes7weB/pen/ybWNbJ?editors=1111#hello

然后，为了让用户滚动到页面顶部，我会使用触发滚动功能的链接id中顶部锚点的href。这将触发此特定链接上的功能，而不是页面中的所有链接。 ;）

最后，这一行：window.location.hash = none;正在尝试将原始onload哈希值转换为none，这被解释为未定义的变量，因为这需要一个字符串。

ReferenceError：none未定义

我会删除该行...
或者如果你真的想清除哈希值：

window.location.hash = "";

使用滚动顶部功能：请参阅codePen以更改HTML标记）

 $(document).ready(function(){
  // Add smooth scrolling to all links
  $("a#backTOtop").on('click', function(event) {
    console.log($(this).attr("href"));

    // Make sure this.hash has a value before overriding default behavior
    if ($(this).href !== "") {
      // Prevent default anchor click behavior
      event.preventDefault();

      // Store hash
      var top = $(this).attr("href");

      // Using jQuery's animate() method to add smooth page scroll
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
      $('html, body').animate({
        scrollTop: $(top).offset().top
      }, 1000, function(){

        // Add hash (#) to URL when done scrolling (default click behavior)
        // window.location.hash = none;
      });
    } // End if
  });
});

Answer 2

如果您不需要影响url哈希，只需删除（或用//注释）该行代码;因为它在javascript中生成错误。

如果要从网址中删除哈希，请尝试以下代码：

#include <array>
#include <utility>
#include <iostream>
#include <type_traits>

template <typename T, T N, bool = (N < T{2})>
struct fibonacci;

template <typename T, T N>
struct fibonacci<T, N, false>
   : std::integral_constant<T,   fibonacci<T, N-1U>::value
                               + fibonacci<T, N-2U>::value>
 { };

template <typename T, T N>
struct fibonacci<T, N, true>
   : std::integral_constant<T, 1U>
 { };

template <std::size_t N, typename T = std::size_t>
struct fibonacci_array
 {
   static_assert(std::is_integral<T>::value,
                 "invalid storage type for fibonacci sequence");

   std::array<T, N> values;

   template <T ... Is>
   constexpr fibonacci_array (std::integer_sequence<T, Is...> const &)
      : values{ { fibonacci<T, Is>::value... } }
    { }

   constexpr fibonacci_array ()
      : fibonacci_array{std::make_integer_sequence<T, N>{}}
    { }

   T operator [] (std::size_t pos) const
    { return values[pos]; }

   T & operator [] (std::size_t pos)
    { return values[pos]; }
 };

int main ()
 {
   constexpr std::size_t n { 10U };

   constexpr fibonacci_array<n, int> const arr;

   for (auto i = 0U; i < n ; ++i )
      std::cout << arr[i] << std::endl;
 }

来源：How to remove the hash from window.location with JavaScript without page refresh?

具有平滑滚动的顶级锚点，不会重复

2 个答案: