Question

我有一个使用3个IE9浏览器窗口的网站：工作清单，查看器，详细信息。我使用localStorage设置上下文并在窗口之间发送消息。所有窗口使用相同的来源但不同的URI。

启动时会显示工作清单。选择对象将打开查看器和详细信息窗口。关闭这些窗口并选择任何对象将打开新的查看器和详细信息窗口;但是localStorage的差异会导致观看者和细节出错。

要混淆事物，关闭查看器和细节窗口并选择任何对象（再次）会产生所需的结果。

这＆＃34;弹跳＆＃34;成功和失败的行动相当一致地重复。

这是一个示例父窗口：

<!DOCTYPE html>
<html>
<head>
<title>Local Storage Home</title>
<script>
var logArea = null;
function init() {
    localStorage.clear();
    logArea = document.getElementById('logArea');
}
function logMsg(msg) {
    logArea.innerHTML = logArea.innerHTML + msg + '\n';
}

var otherWin = null;
var chkFn = function() {
    if (!otherWin.closed){
        setTimeout(chkFn, 100);
    }
    else {
        showValues();
    }
};

window.addEventListener("storage",function(ev) {
    logMsg("STORE: " + ev.key + ' = ' + (ev.newValue || ""));
});

function runTest1() {
    logMsg("---- STARTING TEST 1 ----");
    localStorage.testId = 1;

    var rndNum = Math.floor(Math.random() * 10000);
    otherWin = window.open('LSPopup.html?popName=my first test&popId=1&myVal='+rndNum);
    setTimeout(chkFn, 1000);
}
function runTest2() {
    logMsg("---- STARTING TEST 2 ----");
    localStorage.testId = 2;

    var rndNum = Math.floor(Math.random() * 1000);
    otherWin = window.open('LSPopup.html?popName=my test 2&popId=2&testVal='+rndNum);
    setTimeout(chkFn, 1000);
}

function showValues() {
    logMsg("---- Local Storage");
    var lskeys=Object.keys(localStorage);
    var cnt, len = lskeys.length;

    for(cnt=0; cnt < len; cnt++) {
        logMsg(('0'+(cnt+1)).substr(-2) + ': ' + lskeys[cnt] + ' = ' + localStorage[lskeys[cnt]]);
    }
    logMsg('Avail: ' + localStorage.remainingSpace);
}
</script>
</head>
<body onload="init()">
<h2>Local Storage Test</h2><br>
<div style="width:100% border:1px solid #000; padding: 5px; background-color: #ddd;">Console</div>
<textarea id="logArea" style="width: 100%" rows="12"></textarea>
<button onclick="runTest1()">Start Test 1</button>
<button onclick="runTest2()">Start Test 2</button>
</body>
</html>

这是弹出窗口：

<!DOCTYPE html>
<html>
<head>
<title>Local Storage POPUP</title>
<script>
var logArea = null;

function init() {
    logArea = document.getElementById('logArea');

    var keyvalue = location.search.substr(1).split('&');

    keyvalue.forEach(function (pair) {
        var kv = pair.split('=');
        logMsg('Set ' + kv[0] + ' = ' + decodeURIComponent(kv[1]));
        localStorage[kv[0]] = decodeURIComponent(kv[1]);
    });
    logMsg("---- Existing Values ----");
    var lskeys=Object.keys(localStorage);
    var cnt, len = lskeys.length;

    for(cnt=0; cnt < len; cnt++) {
        logMsg(('0'+(cnt+1)).substr(-2) + ': ' + lskeys[cnt] + ' = ' + localStorage[lskeys[cnt]]);
    }
    logMsg('Avail: ' + localStorage.remainingSpace);
}

function finishTest() {
    window.close();
}

function logMsg(msg) {
    logArea.innerHTML = logArea.innerHTML + msg + '\n';
}
</script>
</head>
<body onload="init()">
<h2>Local Storage POPUP</h2><br>
<div style="width:100% border:1px solid #000; padding: 5px; background-color: #ddd;">Console</div>
<textarea id="logArea" style="width: 100%" rows="12"></textarea>
<button onclick="finishTest()">Complete Test</button>
</body>
</html>

测试页面的结果显示存储事件，但弹出窗口上的localStorage更改从未显示在主窗口上。

IE9 localStorage不一致

0 个答案: