我有这两页
第 1 页:
<!DOCTYPE html>
<html>
<head>
<title>page 1</title>
</head>
<body>
<input id="button" type="submit" value="Submit" onclick="save();"/>
<div id ="stat"></div>
<script type="text/javascript">
var x=1 ;
var test = document.getElementById("stat");
function save() {
x+=1;
test.innerHTML=x;
localStorage.setItem("value",x);
}
</script>
</body>
</html>
第 2 页:
<!DOCTYPE html>
<html>
<head>
<title>page 2</title>
</head>
<body>
<div id ="stat"></div>
<script type="text/javascript">
var stat = document.getElementById("stat");
document.addEventListener('storage', function(e) {
stat.innerHTML=localStorage.getItem("value");
}, false);
</script>
</body>
</html>
我想做的是
在浏览器的两个不同选项卡(或窗口)中打开
Page 1和Page 2。转到
第1页点击按钮。
Page 1中的值得到更新。Page 2中的值也会同时更新。按您想要的次数并获得相同的行为。
我稍微搜索了一下，想到了使用本地存储，但这行不通。我怎样才能做到这一点？
最佳答案
如这里所说 https://www.w3schools.com/html/html5_webstorage.asp :
Web 存储是按来源(按域和协议(protocol))计算的。来自同一个来源的所有页面都可以存储和访问相同的数据。
因此，两个离线网页不能共享同一个本地存储。它们必须从同一个域打开。一种方法是从本地主机 Web 服务器打开它们。然后它将完美运行。
关于javascript - 更新不同页面的数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51961700/