jquery - 跳转到锚标签而不在 URL 中显示主题标签

Question

onload当用户单击帖子标题时，我目前正在使用 jQuery 加载特定主题标签的页面（通过body 类中的函数）。主题标签显然显示在网址中。我想知道是否有办法隐藏主题标签以免弄乱 URL。做了一些搜索，并没有想出太多。

function goToAnchor() {
    location.href = "#post";
}

Answer 1

如此处所示：http: //djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/

function goToByScroll(id){
    $('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}

只需传递您希望滚动到的元素的 id。

Answer 2

您可以将单击事件绑定到这种特定类型的锚点，并防止其出现默认值：

$('.anchorClass').on('click', function(e) {
  e.preventDefault();
  // rest of stuff
});

“其余的东西”意味着找到某种会跳转页面的插件或代码示例。如果你想让它顺利滚动，有一个非常流行的 scrollTo 插件。甚至可能是 scrollTo 插件负责默认预防。

[更新]

杰夫的建议（假设它有效）是“其余的东西”，并且是两个答案中更有用的。;-) 但是防止违约仍然很重要。

Answer 3

我认为您可以只使用 .htaccess 文件。在那里，您可以将一些 url 链接放在同一个地址。

例如fff.com/fffand fff.comandfff.com#anchor可以显示fff.com在浏览器的选项卡上。

Answer 4

跳转/平滑滚动到锚标签而不在 URL 中显示主题标签

试用演示

function scrollSmoothTo(elementId) {
  var element = document.getElementById(elementId);
  element.scrollIntoView({
    block: 'start',
    behavior: 'smooth'
  });
}

#userdiv {
  margin-top: 200px;
  width: 200px;
  height: 400px;
  border: 1px solid red;
}

a {
  color: #337ab7;
  cursor: pointer;
}

a:hover {
  text-decoration: underline;
}

<a onclick="scrollSmoothTo('userdiv')">
  Scroll to userdiv
</a>

<div id="userdiv">
  Lorem ipsum this is a random text
</div>