【问题标题】:window.location = #anchor doesn't work in IEwindow.location = #anchor 在 IE 中不起作用
【发布时间】:2010-11-13 11:45:17
【问题描述】:

在这张地图上:

http://web.pacific.edu/documents/marketing/campus-map/version%202/stockton-campus-2.0.htm

我在顶部有一个锚点,我希望在点击链接时页面跳转到该锚点。

我正在使用

window.location = '#top';

它在 FF、Opera 和 Chrome 中按预期工作,但在 IE 7 中不正常。

我已经尝试了所有排列方式,例如 window.location.hash 和 window.location.assign() 以及 scrollIntoView(true) 和 focus()。

如何让它在 IE 中运行?

编辑:似乎没有任何效果,这让我觉得这不是语法,而是关于 JS 的一些东西......这里是点击事件处理程序......可能是因为它返回 false ?我正抓着稻草。

// Click handler for each location link
$('#index a').click(function()
{
    hideMarkers();
    location.href = location.href + "#top";
    var marker = showMarker( $(this).attr('data-id') );
    GEvent.trigger( marker, "click" );
    return false;
});

编辑:分配给 window.location.hash 在 IE7 和 IE8 中由于通过 HTTP“位置”标头进行页面重定向而加载的页面上的中断。解决方案是返回一个带有 Javascript 的页面,该页面本身将执行重定向。请参阅 Joe Lapp 的答案。

【问题讨论】:

    标签: javascript internet-explorer hash anchor window.location


    【解决方案1】:

    我有这段代码在生产中,它在 IE7 中运行良好...

    location.hash = "#top";
    

    但是,如果您只是想滚动到顶部,这应该会容易得多...

    window.scrollTo(0, 0);
    

    【讨论】:

    • 我应该澄清一下,我最终使用了 scrollTo(0,0)。我觉得有点愚蠢,我不知道这种方法 - 但它确实有效!
    【解决方案2】:

    location object 分为几个属性 - href 只是其中之一

    另一个,hash,就是你要找的。​​p>

    top.location.hash = 'top';
    

    您也可以完全不使用 location/href 来执行此操作 - 只需使用 scrollTo()

    top.scrollTo( 0, 0 );
    

    【讨论】:

    • 真的吗?为我工作。即 7.0.5730.13。仅供参考,您不需要为#top 工作命名锚点 - 浏览器会自动读取它。或者,您可以使用top.scrollTo(0,0);
    • 具体来说,任何与任何元素的 id 不对应的哈希都会自动将您带到页面顶部(即不仅仅是#top)。可能是#top#GOGOGADGETSCROLLUP 或只是#
    【解决方案3】:

    我也遇到了 windows.location.hash 在除 IE7 和 IE8 之外的所有浏览器(至少在 Vista 上)中工作的问题。经过多次试验,我发现页面重定向破坏了哈希分配。

    如果您从通过 HTTP“Location”标头重定向加载的页面中为 windows.location.hash 分配值,则在 IE7 或 IE8 中将发生错误。

    发现这一点后,我能够在 StackOverflow (see here) 的其他地方找到修复程序。解决方案是让浏览器通过 Javascript 重定向。在这里,我从另一个 StackOverflow 页面重新发布解决方案:

    <html>
    <head>
        <meta http-equiv="refresh" content="0; url=__REDIRECT_LOCATION__">
        <script>window.location = "__REDIRECT_LOCATION__";</script>
    </head>
    </html>
    

    这可以解释为什么有些人在设置哈希时遇到问题而有些人没有,但我不知道线程的发起者正在重定向。

    我还应该指出,我不能只使用 scrollTo(),因为我的目的是在不重新加载页面的情况下从地址栏中删除哈希标签,而不是滚动。

    【讨论】:

      【解决方案4】:

      location.href = location.href.split("#")[0] + "#top"

      编辑:避免有两个哈希的可能性。

      【讨论】:

      • 您忘记了 URL 中可能包含查询字符串。虽然从未尝试在查询字符串之后使用 # 。想知道它是否会起作用。
      • 如果你这样做,它不会在 URL 的末尾多次添加 #top 吗?
      • @Nordes:我假设他没有使用主播的href
      • 我将 href 用于其他用途,解释起来很奇怪,但我需要使用 Javascript 来完成。似乎这会在 URL 中多次添加“#top”,但我会尝试一下。
      • 我已经编辑以避免在 url 中有两个哈希的可能性
      【解决方案5】:

      您必须在附加之前检查哈希。我就是这样做的,

      window.location = ((location.href).indexOf('#') == -1 ? location.href + "#top" : location.href);

      【讨论】:

        【解决方案6】:
        window.location.href = '#top';
        

        如果这不起作用,请尝试完整的 URL

        window.location.href = 'http://domain.com/my.html#top';
        

        【讨论】:

        • 是的,你需要 +=
        猜你喜欢
        • 2012-02-07
        • 1970-01-01
        • 2015-03-16
        • 1970-01-01
        • 2019-02-03
        • 2016-12-16
        • 2015-04-14
        • 2018-07-29
        • 2015-01-27
        相关资源
        最近更新 更多