如何使用jQuery/Javascript将标签/窗口中的事件发送到另一个标签/窗口

Question

当另一个声音云窗口或标签正在播放时,soundcloud如何阻止当前播放的声音？

我正在寻找一种方法将事件从选项卡/窗口发送到另一个,而不使用子窗口设计.

我尝试使用自定义Cookie事件,但它不会影响其他标签.

Answer 1

使用localStorage.

您是否知道localStorage会发生事件？更具体地说,只要在另一个浏览上下文中添加,修改或删除项目,它就会触发事件.实际上,这意味着无论何时触摸localStorage任何给定的选项卡,所有其他选项卡都可以通过侦听对象storage上的事件来了解它window,如下所示:

window.addEventListener('storage', function(e){
  console.log(event.key, event.newValue);
});

每当选项卡修改某些内容时localStorage,每个其他选项卡都会触发一个事件.这意味着我们只需通过设置值即可跨浏览器选项卡进行通信localStorage.

请参阅该文章的作者提供的本地存储模块,该文章提供了可能对您有用的API:

ls.on(key, fn(value, old, url))
ls.off(key, fn)