H5 storage 事件监听

H5 storage事件监听

在事件处理函数中，触发事件的事件对象（event参数值）具有如下几个属性:

• event.key 属性：属性值为在 session 或localStorage 中被修改的数据键值。
• event.oldValue 属性：属性值为在sessionStorage 或localStorage中被修改的值。
• event.newValue 属性：属性值为在 sessionStorage 或localStorage中被修改后的值
• event.url属性：属性值为修改 sessionStorage或localStorage 中值的页面的URL地址
• event.storageArea属性 : 属性值为被变动的 sessionStorage 对象或localStorage对象

代码中用到的函数：

charCodeAt() 可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。

fromCharCode() 可接受一个指定的 Unicode 值，然后返回一个字符串。

String.fromCharCode(n1, n2, ..., nX)
eg:
var n = String.fromCharCode(72,69,76,76,79);//"HELLO"

escape() 来编码字符串（注释： 现在已使用encodeURI取而代之）

其中十六进制转义序列将被它们表示的字符替换。

var test1="Visit W3School!"

test1=escape(test1);//输出：Visit%20W3School%21

unescape() 可对通过 escape() 编码的字符串进行解码。（注释： 现在已使用decodeURI取而代之）

1) 不同页面监听

//A页面：监听storage
window.addEventListener("storage", function (e) {
     alert(e.newValue);
})

//B页面：修改B页面
 localStorage.clear();
 localStorage.setItem('foo', 'bar');

2) 同一页面监听

    var orignalSetItem = localStorage.setItem;
    localStorage.setItem = function(key,newValue){
        var setItemEvent = new Event("setItemEvent");
        setItemEvent.newValue = newValue;
        window.dispatchEvent(setItemEvent);
        orignalSetItem.apply(this,arguments);
    }
    window.addEventListener("setItemEvent", function (e) {
        alert(e.newValue);
    });
    localStorage.setItem("nm","1234");