手风琴集从 localStorage 变量激活答案

【问题标题】：Accordion set active from localStorage variable手风琴集从 localStorage 变量激活
【发布时间】：2014-11-20 11:23:21
【问题描述】：

我有一个 jQuery UI 手风琴，我需要记住它的状态（上次打开哪个标题）。

这是我的尝试：

var storedActive = localStorage.getItem("storedActive");
if (isNaN(storedActive)){
    storedActive = false;
}
console.log(storedActive);
jQuery('#accordion').accordion({
    heightStyle: "content",
    collapsible: true,
    header: 'h4',
    active: storedActive,
    activate: function(event, ui){
        if(ui.newHeader.context){
            storedActive = ui.newHeader.context.id.slice(-1); //getting id of clicked header
        }else{
            storedActive = false;
        }
        localStorage.setItem("storedActive", storedActive);
    }
});

第 5 行中的这个console.log(storedActive) 证明了最后点击的标题的值被正确地记住和恢复了。问题是手风琴没有打开任何标题。

奇怪的是，当我手动输入值storedActive 时，手风琴会按应有的方式打开标题。只是从localStorage恢复值时出现了一些问题。

【问题讨论】：

标签： javascript jquery jquery-ui local-storage

【解决方案1】：

我在从 localStorage 获取变量时忘记使用 parseInt。现在一切正常。谢谢宁斯利！

var storedActive = parseInt(localStorage.getItem("storedActive"));
if (isNaN(storedActive)){
    storedActive = false;
}
console.log(storedActive);
jQuery('#accordion').accordion({
    heightStyle: "content",
    collapsible: true,
    header: 'h4',
    active: storedActive,
    activate: function(event, ui){
        if(ui.newHeader.context){
            storedActive = ui.newHeader.context.id.slice(-1); //getting id of clicked header
        }else{
            storedActive = false;
        }
        localStorage.setItem("storedActive", storedActive);
    }
});

【讨论】：

【解决方案2】：

我用这个：

$( ".accordion" ).accordion({
    activate: function(event, ui) {        
        localStorage.setItem("AccordionId", $(this).accordion("option", "active"))
    },
    active: parseInt(localStorage.getItem("AccordionId"))
}

如果您的页面中有多个手风琴，请将“AccordionId”替换为该手风琴的唯一 ID。

它也适用于 Jquery 选项卡

【讨论】：