Question

我正在使用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和一些版本的I.E

Microsoft报告Internet Explorer 5.5 link text

可能存在同样的问题

我无法使用microsoft建议的解决方案，即捕获事件而不是触发它，但只是滚动到视图中，因为使用set top.location.hash作为onLoad事件的一部分。

Answer 1

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

我无法重现IE7中的错误，而且你是我见过的第一个支持IE5.5的人，因此我无法真正帮助你;）

Answer 2

您还可以使用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;
    }
}

在第一个参数中，您需要传递frameset top window。

Answer 3

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

使用jquery，我做了：

if($.browser.webkit){
    $(window).unload(function() {
        top.window.location.hash = hash_value;
    });
}else{
    top.window.location.hash = hash_value;
}

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

-Jacob

Answer 4

对于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;
    }
  }
}

Answer 5

我有一个解决方法，它涉及一个带有嵌入式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>

希望这有帮助。

Answer 6

您是否尝试创建隐藏的哈希链接并点击它们甚至点击它们？

Answer 7

做location.href = '#yourhash';怎么样也许绕过了错误。

在框架中设置location.hash

7 个答案: