1.地址栏传参也算是多个标签页通信吧
2.localstorage、cookie等本地存储方式
(1)localstorage 在一个标签页里被添加、修改或删除时,都会触发一个storage事件,这样我们就可以利用这一点在其他标签页面里监听这个事件 就可以获取到新值
标签页1:
$(function(){
$("#btn").click(function(){
var name=$("#name").val();
localStorage.setItem("name", name);
});
});
标签页2:
$(function(){
window.addEventListener("storage", function(event){
console.log(event.key + "=" + event.newValue);
});
});
(2)使用cookie+setInterval 存储cookie后 每隔一段合理的时间就读取一次cookie 即可获取
标签页1:
$(function(){
$("#btn").click(function(){
var name=$("#name").val();
document.cookie="name="+name;
});
});
标签页2:
$(function(){
function getCookie(key) {
return JSON.parse("{\"" + document.cookie.replace(/;\s+/gim,"\",\"").replace(/=/gim, "\":\"") + "\"}")[key];
}
setInterval(function(){
console.log("name=" + getCookie("name"));
}, 10000);
});