在Chrome以外的任何浏览器中,localStorage都不会清除

时间:2015-05-13 19:23:48

标签: javascript jquery local-storage

在Chrome以外的任何浏览器环境中进行localStorage清算时,我遇到了问题。我有一个验证码,使用用户必须绘制的形状来提交表单。用户可以单击reverse以生成新形状。为了保持输入到先前字段的信息,每次请求新形状时,我都将数据存储在localStorage中。但是,如果刷新页面,我希望localStorage完全被删除。

以下是用户点击的print(sorted(name_age, key = lambda i : int(i.split(',')[1]), reverse=True)) 代码:

span

这是localStorage的JS:

span

此代码在Chrome中完美运行,但IE和Firefox中的页面刷新无法清除localStorage。我是否因为localStorage在多个浏览器中清除而做错了什么?

修改

我尝试过使用<span style="color:#0000EE;cursor:pointer;" id="new-shape" onclick="window.location.reload()" title="Click for a new shape">new shape</span> ,并且考虑到$('#new-shape').on('click', function () { var stickies = $('.sticky'); var dropdowns = $('select'); window.onbeforeunload = function () { localStorage.setItem("branch", $('#00NL0000003INTJ').val()); localStorage.setItem("department", $('#00NL0000003I0Ux').val()); localStorage.setItem("contact", $('#00NL0000003INUC').val()); localStorage.setItem("company", stickies[0].value); localStorage.setItem("firstName", stickies[1].value); localStorage.setItem("lastName", stickies[2].value); localStorage.setItem("phone", stickies[3].value); localStorage.setItem("ext", stickies[4].value); localStorage.setItem("email", stickies[5].value); localStorage.setItem("help", stickies[6].value); } }); window.onload = function () { var stickies = $('.sticky'); var dropdowns = $('select'); var selects = [localStorage.getItem("branch"), localStorage.getItem("department"), localStorage.getItem("contact")]; var company = localStorage.getItem("company"); var first = localStorage.getItem("firstName"); var last = localStorage.getItem("lastName"); var phone = localStorage.getItem("phone"); var ext = localStorage.getItem("ext"); var email = localStorage.getItem("email"); var help = localStorage.getItem("help"); var stickiesArr = [company, first, last, phone, ext, email, help]; for (var i = 0; i < stickiesArr.length; i++) { if (stickiesArr[i] != null) { stickies[i].value = stickiesArr[i]; } } for (var i = 0; i < selects.length; i++) { if (selects[i] != null) { dropdowns[i].value = selects[i]; } } //this allows the wipe out of all data on a page refresh, //but clicking on "new shape" will maintain the data localStorage.clear(); }

1 个答案:

答案 0 :(得分:0)

我设法最终让它发挥作用。部分问题在于:

window.onbeforeunload = function () { (...) }

FireFoxIE11这两个匿名函数调用都遇到了问题。我不得不将on.click事件更改为:

$('#new-shape').on('click', function () {
    var stickies = $('.sticky');

    localStorage.setItem("branch", $('#00NL0000003INTJ').val());
    localStorage.setItem("department", $('#00NL0000003I0Ux').val());
    localStorage.setItem("contact", $('#00NL0000003INUC').val());

    localStorage.setItem("company", stickies[0].value);
    localStorage.setItem("firstName", stickies[1].value);
    localStorage.setItem("lastName", stickies[2].value);
    localStorage.setItem("phone", stickies[3].value);
    localStorage.setItem("ext", stickies[4].value);
    localStorage.setItem("email", stickies[5].value);
    localStorage.setItem("help", stickies[6].value);
});

我的window.onload匿名函数调用必须稍微重新配置为:

window.onload = function () {
    var stickies = $('.sticky');
    var dropdowns = $('select');
    var selects = [localStorage.getItem("branch"), localStorage.getItem("department"), localStorage.getItem("contact")];

    var company = localStorage.getItem("company");
    var first = localStorage.getItem("firstName");
    var last = localStorage.getItem("lastName");
    var phone = localStorage.getItem("phone");
    var ext = localStorage.getItem("ext");
    var email = localStorage.getItem("email");
    var help = localStorage.getItem("help");

    var localStorageArr = [company, first, last, phone, ext, email, help];

    //input fields sticky
    for (var i = 0; i < localStorageArr.length; i++) {
        stickies[i].value = localStorageArr[i];
    }

    //dropdown fields sticky
    for (var i = 0; i < selects.length; i++) {
        if (selects[i] != null) {
            dropdowns[i].value = selects[i];
        } else {
            dropdowns[i].selectedIndex = 0;
        }
    }

    //fixing textarea
    if (help === null) {
        stickies[6].value = "";
    }
    localStorage.clear();
}

一些hacky解决方法,但结果现在正在按预期工作。