6

我正在使用 pnotify 插件向用户显示通知。但是，如果用户通过单击 X 图标关闭 1 个选项卡中的通知，我想删除所有选项卡上的通知。

我为此使用 localstorage，每次向用户显示新通知时，它都会添加到 localStorage。当用户按下 X 图标时，我会这样做localStorage.removeItem(key)。如何收听此事件以关闭所有选项卡中的通知？

我的听众在下面：

$(window).bind('storage', function(e) {
    // if it was removed
    if (e.originalEvent.newValue == null) {
        var notificationObject = e.originalEvent.oldValue;

        // call remove function on pnotify object
        notificationObject.remove();
    }
});

我注意到如果 newValue 被删除，它会变成 null ，理论上这会起作用（尚未测试），但是如果在该项目上调用 removeItem ，它是否总是返回 null 是否可靠？如果项目值更改为null，它将触发该事件，因为该值已正确更改？

4

2 回答 2

5

本地存储将所有内容存储为字符串。

localStorage.setItem("foo", null);

// returns "null"
localStorage.getItem("foo");

事实上，它newValue是null在它被移除的时候。MDN：StorageEvent说：

键的新值。这newValue是null当更改已被存储clear()方法调用或key已从存储中删除时。只读。

因此，null使用=== null.

于 2016-01-19T22:33:06.547 回答
2 
$(window).on("itemRemoved", function(e, args) {
  console.log(e, args);
  if (!localStorage.getItem(args)) {
    // do stuff
  }
})

fn = localStorage.removeItem; 
localStorage.removeItem = function() { 
  var args = arguments; 
  setTimeout(function() {
    $(window).trigger("itemRemoved", [args[0]])
  }); 
 return fn.call(localStorage, args[0]); 
}
于 2016-01-19T22:44:22.547 回答