18

我想做与我迄今为止发现的相反的事情。我用 js 设置了很多高度，我想在页面加载后导航到 url 中的主题标签。我猜这很简单，但我没有看到明显的答案......例如，请查看这里......

http://alavita.rizenclients.com/#story

尝试使用代码进行此操作...

$(window).load(function() {
    var hashTag = window.location.hash;
    window.location = '/' + hashTag;
});

实际上并没有把我带到标记部分的顶部......

4

5 回答 5

36

如果您只想在页面加载后更改哈希：

window.onload = function (event) {
    window.location.hash = "#my-new-hash";
};

如果您想导航到带有新哈希的 URL：

window.location.href = "http://website.com/#my-new-hash";

如果你想监听 URL 哈希的变化；您可以考虑使用window.onhashchange DOM 事件。

window.onhashchange = function () {
    if (location.hash === "#expected-hash") {
        doSomething();
    }
};

但还不是每个主要浏览器都支持它。它现在拥有广泛的浏览器支持。您还可以通过小间隔轮询来检查更改window.location.hash，但这也不是很有效。

对于跨浏览器解决方案；我建议Ben Alman 的jQuery hashchange 插件将这些方法和其他一些方法与回退机制结合起来。

编辑：您的问题更新后，我知道您希望页面滚动到书签？：

您可以使用Element.scrollTopjQuery 或 jQuery 的$.scrollTop()方法。

$(document).ready(function (event) {
    var yOffset = $("#my-element").offset().top;
    $("body").scrollTop(yOffset);
});

请参阅此处的文档。

于 2013-01-15T23:02:36.987 回答
2

出于某种原因，MS Edge 42 和 IE 11 都不会为我滚动到新书签，即使window.location.reload(true)在设置新书签后进行操作也是如此。所以我想出了这个解决方案：在你正在加载的页面上插入这个脚本（需要 jquery）

$(document).ready(function() {
 var hash = window.location.hash;
 if (hash) {
  var elem = document.getElementById(hash.substring(1));
  if (elem) {
   elem.scrollIntoView();
  }
 }
});
于 2018-10-02T10:47:53.967 回答
1

使用scrollTo或不考虑由css 选择器scrollIntoView创建的任何偏移量，该选择器通常用于通过将其设置为负值来使页面滚动到锚点上方。:targetposition: relativetop

这将在尊重选择器的同时滚动到锚点:target：

if (location.hash) {
    window.location.replace(location.hash);
}
于 2020-07-28T21:52:57.517 回答
0

您可以设置当前位置：

window.location = 'http://alavita.rizenclients.com/#story';

或者设置哈希（如果还没有），然后重新加载：

window.location.hash = hashTag;
window.location=window.location.href;
于 2013-01-15T22:39:38.763 回答
0

你改变了你的问题。

看看这个解决方案。 https://stackoverflow.com/a/2162174/973860以便您了解发生了什么以及如何实现跨浏览器解决方案。

注意：在底部，他提到了一个 jquery 插件，可以满足您的需求。

http://benalman.com/projects/jquery-hashchange-plugin/

这个插件将允许你做这样的事情。这将适用于您当前的页面。但是您可能希望将其修改为更健壮。

$(function(){

    // Bind the event.
    $(window).hashchange( function(){
        // get the hash
        var hash = window.location.hash;
        // click for your animation
        $('a[href=' + hash + ']').click();
    })

    // Trigger the event (useful on page load).
    $(window).hashchange();

});
于 2013-01-15T22:56:41.897 回答