6

我正在使用 ajax 来更新框架中页面的位置。但是在设置哈希的位置时（特别是在 Chrome 和某些版本的 IE（5.5）上，但偶尔在 IE7 上）页面正在重新加载。

以下 html 演示了该问题。

主框架.... frame.html 是

<html><head>
<frameset rows="*">
<frame src=sethash.html frameborder=0 scrolling=auto name=somebody>
</frameset>
</head></html>

sethash.html 页面是 .

<html><head>
<script language=JavaScript>
var Count = 0;
function sethash()
{  
  top.document.location.hash = "hash" + Count;  
  Count++;
}
</script>
</head>
<body onload="alert('loaded')">
<h1>Hello</h1>
<input type='button' onClick='sethash()' value='Set Hash'>
</body>
</html>`

在大多数浏览器上，加载 frame.html 会在页面加载时显示一次加载的警报。然后，当按下设置哈希按钮时，url 将被更改，但加载的警报的哈希不会再次显示。在 chrome 和某些版本的 IE 上

Microsoft 报告 Internet Explorer 5.5链接文本可能存在相同问题

我不能使用微软建议的解决方案，即捕获事件而不触发它，而只是滚动到视图中，就像使用将 top.location.hash 设置为 onLoad 事件的一部分一样。

4

7 回答 7

6

Webkit（以及扩展，Chrome）对 location.hash 的行为很奇怪。有一些关于它的开放错误，最相关的可能是这个：https ://bugs.webkit.org/show_bug.cgi?id=24578记录了您在 location.hash 更改时刷新页面的问题。看起来您现在最好的选择是交叉手指并希望它得到及时修复。

虽然我无法重现 IE7 中的错误，而且你是我见过的第一个支持 IE5.5 的人，所以我无法真正帮助你；）

于 2009-04-03T00:54:52.363 回答
3

您还可以使用 HTML5 history.pushState()更改哈希，而无需在 Chrome 中重新加载页面。像这样的东西：

// frameset hash change function
function changeHash(win, hash) {
    if(history.pushState) {
        win.history.replaceState(null, win.document.title, '#'+hash);
    } else {
        win.location.hash = hash;
    }
}

在第一个参数中，您需要传递框架集顶部窗口。

于 2012-02-07T07:54:47.837 回答
2

我也有这个问题。我的情况允许我创建一个窗口解除绑定事件，该事件将哈希设置为我想要的值，因为用户浏览器到下一页或刷新。这对我有用，但不确定它是否对你有用。

使用 jquery，我做了：

如果（$.browser.webkit）{
    $(窗口).unload(函数() {
        top.window.location.hash = hash_value;
    });
}别的{
    top.window.location.hash = hash_value;
}

从技术上讲，您不需要进行 webkit 检查，但我认为对于使用 firefox 的人来说，在刷新框架集之前查看正确的哈希值可能会很好。

-雅各布

于 2010-01-30T22:45:31.433 回答
2

对于 chrome 和 safari，您需要使用 window.location.href 来使哈希工作而不是 window.location.hash

见下面的代码

function loadHash(varHash)
{
  if(varHash != undefined) {
    var strBrowser = navigator.userAgent.toLowerCase();

    if (strBrowser.indexOf('chrome') > 0 || strBrowser.indexOf('safari') > 0) {
        this.location.href = "#" + varHash;
    }
    else {
        this.window.location.hash = "#" + varHash;
    }
  }
}
于 2011-04-05T13:04:22.203 回答
1

我有一个解决方法，它涉及一个带有嵌入式 iframe 的整页表。我用一个占据 100% 高度和 100% 宽度并且有两行的表格替换了我的框架集。然后，在每个表格单元格中，我放置了一个 iframe，它为每个单元格占用 100% 的高度和宽度。从本质上讲，这模仿了一个框架集，而不是一个框架集。最重要的是，哈希更改无需重新加载！

这是我的旧代码：

<html>
<head>
<title>Title</title>
</head>
<frameset rows="48,*" frameborder="yes" border="1">
    <frame name="header" noresize="noresize" scrolling="no" src="http://header" target="_top">
    <frame name="main" src="http://body" target="_top">
    <noframes>
    <body>
    <p>This page uses frames, but your browser doesn&#39;t support them.</p>
    </body>
    </noframes>
</frameset>
</html>

...这是我的新代码：

<html>
<head>
<title>Title</title>
<style type="text/css">
body { margin: 0px; padding: 0px; border: none; height: 100%; }
table { height:100%; width:100% }
td { padding: 0px; margin: 0px; border: none; }
td.header { height: 48px; background-color: black; }
td.body { background-color: silver; }
iframe.header { border: none; width: 100%; height: 100%; }
iframe.body { border: none; width: 100%; height: 100%; }
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0">
  <tr><td class="header"><iframe class="header" src="http://header" target="_top" scrolling="no"></iframe></td></tr>
  <tr><td class="body"><iframe class="body" src="http://body" scrolling="no"></iframe></td></tr>
</table>
</body>
</html>

希望这可以帮助。

于 2011-05-27T19:03:59.707 回答
0

您是否尝试过创建指向哈希的隐藏链接并在它们上触发点击？

于 2009-04-03T21:43:49.130 回答
0

怎么办location.href = '#yourhash';也许它绕过了这个错误。

于 2009-04-29T02:26:09.793 回答