jQuery 跳转到锚标签而不在 URL 中显示主题标签
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10147283/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Jump to anchor tag without showing hashtag in URL
提问by chris_s
I am currently using jQuery to load a page at a specific hashtag (via onloadfunction in the body class) when a user clicks on a post title. The hashtag obviously shows up in the url. I was wondering if there was a way to hide the hashtag from cluttering up the URL. Did some searches and did not come up with much.
onload当用户单击帖子标题时，我目前正在使用 jQuery 在特定主题标签（通过body 类中的函数）加载页面。主题标签显然显示在网址中。我想知道是否有办法隐藏主题标签以免混淆 URL。做了一些搜索，并没有想出太多。
function goToAnchor() {
location.href = "#post";
}
回答by Jeff Hines
As seen here: http://djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/
如下所示：http: //djpate.com/2009/10/07/animated-scroll-to-anchorid-function-with-jquery/
function goToByScroll(id){
$('html,body').animate({scrollTop: $("#"+id).offset().top},'slow');
}
Just pass the id of the element you wish to scroll to.
只需传递您希望滚动到的元素的 id。
回答by Greg Pettit
You can bind a click event to this particular kind of anchor, and prevent default on it:
您可以将单击事件绑定到这种特定类型的锚点，并防止对其进行默认：
$('.anchorClass').on('click', function(e) {
e.preventDefault();
// rest of stuff
});
The "rest of stuff" means locating some sort of plugin or code sample that will jump the page. If you want it to roll along smoothly, there's a scrollTo plugin that's quite popular. It might even be that the scrollTo plugin takes care of the default prevention.
“其余的东西”意味着定位某种插件或代码示例，将跳转页面。如果你想让它顺利滚动，有一个非常受欢迎的 scrollTo 插件。甚至可能是 scrollTo 插件负责默认预防。
[update]
[更新]
Jeff's suggestion (assuming it works) is the "rest of stuff" and is the more useful of the two answers. ;-) But preventing default is still important.
杰夫的建议（假设它有效）是“其余的东西”，并且是两个答案中更有用的一个。;-) 但是防止违约仍然很重要。
回答by VWpolo Crystaline
I think you can just use the .htaccess file. There you can make some url links go at the same address.
我认为你可以只使用 .htaccess 文件。在那里你可以让一些 url 链接指向同一个地址。
For example fff.com/fffand fff.comand fff.com#anchorcan be shown as fff.comon the browser's tab.
例如fff.com/fff，fff.com和fff.com#anchor可以显示fff.com在浏览器的选项卡上。
回答by Manoj Selvin
Jump/Smooth scroll to anchor tag without showing hashtag in URL
跳转/平滑滚动到锚标签而不在 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>