6

我已经建立了一个站点,它使用 History.js 插件通过 AJAX 从一个页面导航到另一个页面,并相应地更新 URL。除 IE 外,一切正常;当您刷新页面时,它实际上是从您来到的第一页加载内容,而不是当前页面内容。在“体面”的浏览器中,它不会从任何页面加载内容,它只会加载该 URL 的整个页面,这是我 IE 应该做的。

我认为它不明白如何处理哈希。如果您访问http://www.crownacre.voyced.com/contact-us/它可以正常工作,但是当您访问http://www.crownacre.voyced.com/#contact-us/(带有哈希)时没有。

如果页面在路径名中检测到 # ,我尝试重定向该页面,但无法检测到这一点,因为 window.location.pathname 和 History.getHash() 返回没有任何哈希的路径。

有什么建议么?我见过一些使用这个插件的网站有同样的问题,在这里也有类似的问题,但没有解决方案。

提前致谢!

4

3 回答 3

3

我在重写 tarheelreader.org 时遇到了同样的问题。我正在使用 History.js,它工作正常,除了 IE8 中的刷新问题。这个黑客对我有用。

在仅在初始页面加载时运行的启动代码中,我执行以下操作:

var url = window.location.href;
if (url.indexOf('#') > -1) {
    // ie refresh hack
    controller.stateChange();
}

controller.stateChange()我用于所有历史记录更改的状态更改处理程序在哪里。

function stateChange() {
    // handle changes in the URL
    var hist = History.getState(),
        url = hist.url,
        context = hist.data;
    renderUrl(url, context).then(function(title) {
        document.title = title;
    });
}

您可以在https://github.com/gbishop/TarHeelReaderTheme查看 main.js 和 controller.js 中的所有代码

编辑 进一步探索导致 History.js 使用初始 URL 而不是根的情况。这个黑客似乎可以处理这种情况。

function stateChange() {
    // handle changes in the URL
    var hist = History.getState(),
        url = hist.url,
        bar = window.location.href,
        context = hist.data;
    //console.log("State changed...", url, context);
    if (url != bar && bar.indexOf('#') > -1) {
        //console.log('bar = ', bar);
        // I think we only get here in IE8
        // hack for hash mode urls
        var root = History.getRootUrl(),
            hashIndex = bar.indexOf('#');
        if (root != bar.slice(0, hashIndex)) {
            // try to fix the url
            url = root + bar.slice(hashIndex);
            //console.log('new url =', url);
            window.location.href = url;
        }
    }
    renderUrl(url, context).then(function(title) {
        document.title = title;
    });
}
于 2013-01-30T15:06:16.060 回答
2

这对我有用:

<script>
    var url = new String(document.location);
    if (url.indexOf("#") > -1) {
        alert("There is a Hash in the path");
    }
</script>

编辑:

function LocationTest()
{
    var loc = window.location;
    alert(loc.href);
    alert(loc.protocol + "//" + loc.host + loc.pathname + loc.search + loc.hash);
    alert(loc.href == loc.protocol + "//" + loc.host + loc.pathname + loc.search + loc.hash);
}

示例来源:window.location 解释

于 2013-01-29T17:02:15.080 回答
1

也许是一个解决方案:你能试试我的 fork 的 History.js 非官方版本 1.8a2,来自: https ://github.com/andreasbernhard/history.js

...并提供反馈?非常感谢你!

于 2013-01-29T17:59:09.880 回答