Question

我正在开发一个广泛使用jQuery来动态创建页面元素的页面。

在我发布到下一页然后点击后退按钮后，使用Chrome和IE时，所有动态创建的元素都会消失。

但是，在Firefox和Safari中，元素仍保留在页面上。

如何让Chrome和IE显示与Firefox和Safari相同的行为？

由于

Answer 1

这是一个简单的骗子：

抓住您网页的innerHTML并将其分配给window.name。页面加载后，请检查您的数据是否在window.name中。如果是，请将其复制回DOM

Answer 2

我最终做的是实际使用页面中的AJAX调用来从Session获取项目，并使用jQuery重新创建项目。

Answer 3

通过设置window.sessionStorage来存储元素的内容，我可以在从后退按钮（使用Firefox）返回后恢复一些HTML。

与此示例类似：

<script>
    if (sessionStorage.getItem("sessionHtml") != null) {
        $('#sessionContent').html(sessionStorage.getItem("sessionHtml"));
    }

    window.onbeforeunload = function (event) {
        $('#sessionContent').html('Data that's restored when you come back');
        sessionStorage.setItem("sessionHtml", $('#sessionContent').html());
    }
</script>

<body>
    <div id="sessionContent"></div>
</body>

重要：此方法无法区分用户是导航还是刷新页面。一旦在sessionHtml中存储了某些内容，实际上会阻止使用新数据刷新页面的能力。如果您的页面是动态的，那么这可能不是什么大问题。

也许有人可能会更好地理解如何实现一个良好的独立于浏览器的方法来确定事件是刷新还是返回导航？

后退按钮影响由jquery动态创建的元素

3 个答案: