我正在使用document.open()+ write()+ close()从客户端创建一个新页面.这有效,但它会用新页面替换当前的历史元素,因此当用户点击它们时,它们看不到它们刚刚打开的页面.例:
我已经尝试插入历史元素,history.pushState()但这也不起作用.它允许document.open页面有一个新的URL.单击返回将用户返回到我想要显示的页面的URL,但它仍然是"新页面".
完整的HTML页面代码如下.此类示例在小提琴中不起作用,但可以在本地进行测试.
<html>
<body>
<button onclick="clickme()">Click me</button>
<script>
function clickme() {
history.pushState(null, null, "Results/");
document.open("text/html");
document.writeln("New Page");
document.close();
}
</script>
</body>
</html>
注意:寻找具有跨浏览器支持的解决方案,包括可能稍微加强安全性的最新Chrome 45.
我会为第 3 页创建一个实际的网页，而不是推送虚假的历史事件。
较旧的 IE（9 及以下版本）不支持 History.pushState，并且在某些 Android 上存在错误，这对于您的项目来说可能不是问题。http://caniuse.com/#search=history.pushState
如果您无法更改后端以重定向到第 3 页，您可以在 javascript 中执行此操作：
第2页：
function clickme() {
var html = 'my generated html';
localStorage.savedHtml = html;
window.location = 'page3.htm';
}
第 3 页：
<html>
<head>
<!-- I'm assuming you're using jquery -->
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<div id="restoredHtml"></div>
<script>
$(function(){
var savedHtml = localStorage.savedHtml || 'No html to restore';
$('#restoredHtml').html(savedHtml);
localStorage.removeItem('savedHtml');
});
</script>
</body>
</html>