帶有錨鏈接javascript或jquery的菜單

Question

我在鏈接中找到了帶有錨點的jquery代碼。

jQuery (document) .ready (function () {
    jQuery ("a"). on ('click', function (event) {
        if (this.hash !== "") {
            event.preventDefault ();
            var hash = this.hash;
            jQuery ('html, body'). animate ({scrollTop: jQuery(hash).offset ().top}, 800, function () {
              window.location.hash = hash;
            });
        }
    });
});

我的菜單在錨點上作為一個頁面工作，但是在那里有另一個鏈接，該鏈接指向另一個子頁面，在單擊帶有錨點的鏈接后，我必須使用斜杠/返回帶有錨點鏈接的單個頁面。 我希望在頁面的地址欄中看不到錨鏈接，而只能看到主頁地址本身，但是該鏈接將被定向到帶有錨的頁面上的適當部分。

我的菜單：

<ul id = "categories" class="nav navbar-nav">
 <li><a href="/#anchor1">Anchor 1</a></li>
 <li><a href="/#anchor2">Anchor 2</a></li>
 <li><a href="/#anchor3">Anchor 3</a></li>
 <li><a href="new_page.html">New page</a></li>
</ul>

瀏覽器中的地址欄：

http://example.com/#anchor1

我想在單擊錨菜單后將鏈接移到錨站點，但將錨的名稱隱藏在地址中：

http://example.com/

我正在尋求幫助怎么辦？

Answer 1

1.您需要刪除此行：-

window.location.hash = hash;

從您的代碼中，將哈希部分添加到URL。

代碼必須是：

<script>
jQuery (document) .ready (function () {
  jQuery ("a"). on ('click', function (event) {
    if (this.hash !== "") {
      event.preventDefault ();
      var hash = this.hash;
      jQuery('html, body').animate({scrollTop: jQuery(hash).offset ().top}, 800);
    }
  });
});
</script>