如何使用localStorage保存手风琴的状态

我想保存手风琴的状态并在页面刷新后保留它。

到目前为止这是脚本。

 $(document).ready(function () { $('table').accordion({ header: '.category', collapsible: true, active: localStorage.getItem('accordion-active')||false }); }); window.onload = function(){ localStorage.setItem('accordion-active',$('table').accordion('option','active')); };  

JFIDDLE

但似乎我无法使其发挥作用。 有什么建议？

Answer 1

您可以通过在acivate事件中存储当前活动折叠的索引来执行此acivate ，然后在acivate上的active选项中使用它

 $(document).ready(function () { $('table').accordion({ header: '.category', collapsible: true, activate: function(e, ui) { localStorage.setItem('accordion-active', $(this).accordion( "option", "active" )); }, active: +localStorage.getItem('accordion-active') }); }); 

小提琴

Answer 2

 $(document).ready(function () { $('table').accordion({ header: '.category', collapsible: true, activate: function(e, ui) { localStorage.setItem('accordion-active', $(this).accordion( "option", "active" )); }, active: parseInt(localStorage.getItem('accordion-active')) }); }); 

如果您希望手风琴中的所有表最初加载为折​​叠，请使用parseInt（localStorage.getItem（’accordion-active’））作为活动选项。