如何在JQM中有效地使用localStorage

时间:2014-08-08 04:52:09

标签: javascript jquery html5 jquery-mobile

当我们刷新页面时,我使用HTML5 localStorage来保持下拉框不变,代码是这样的。

SCRIPT

$(document).on('pagecreate', '#outerPage', function () {
    var local = localStorage.selectVal;
    if (local) {
        var selected = $('body').find('.ui-select-custom');
        //Select the value stored
        $(selected).val(local);
        if (local == 0) {
            $('span.ui-select-custom').html('Venta');
        } else $('span.ui-select-custom').html('Alquiler');
    }
    $(".ui-select-custom").bind("change", function (event, ui) {
        var currentVal = $(this).val();
        localStorage.setItem('selectVal', currentVal);
    });
});

HTML

<select class="ui-select-custom" data-mini="true">
    <option name="im_va" id="im_va" value="0">Venta</option>
    <option name="im_va" id="im_va" value="1">Alquiler</option>
</select>

工作正常。但问题是假设如果我在同一浏览器中打开另一个窗口,它也会保持相同的值。它假设是默认值。

有人可以解释一下吗

谢谢&amp;问候

1 个答案:

答案 0 :(得分:1)

您的问题似乎是您正在使用本地存储,其中会话存储是合适的解决方案。

本地存储和会话存储在两个完全不同的范围内运行,这实际上意味着该域永久保留本地存储,而会话存储暂时保留在该会话中。

会话存储由您的案例中的浏览器窗口或选项卡定义,因此您会发现从本地存储交换到会话存储应解决您的问题,并允许在您的选项卡之间存储两个单独的存储流。

这篇文章过去帮助我完全理解了这个概念:-link-