【发布时间】：2017-08-27 15:10:16
【问题描述】：
有多个可折叠面板，当单击放置在该面板上的按钮时，特定面板会折叠。单击时，此按钮会切换为加号和减号图标。折叠的面板和按钮图标应保持相同的状态页面刷新。面板部分工作正常，但切换按钮不会保持相同状态，即点击时加号图标切换为减号图标，但再次点击时，它仅保留为减号图标，而不是变回加号图标。我正在使用 localstorage 来保存面板和按钮的状态。但是我在某处缺少正确的按钮方法。我是 jquery 的新手，并尝试了此处和其他平台上给出的所有答案，但无法找出确切的问题。请帮助指出出了什么问题。如果需要任何其他信息，请告诉我。
<div class="row">
<div class="col-md-8 col-sm-6 col-xs-12">
<div class="panel panel-primary">
<div class="panel panel-heading" style="height: 45px;">
<h4 class="text-center" ><span class="glyphicon glyphicon-film" aria-hidden="true" style="padding-right: 10px;"></span>Name
<span data-toggle="collapse" data-target="#{{ template }}">
<span class="more-less pull-right" aria-hidden="true" id="{{ icon }}" ><i class="glyphicon glyphicon-plus-sign"></i></span>
</span>
</h4>
</div>
<div class="panel-collapse collapse" id="{{ template }}">
<div class="panel-body">
<div class="row">
<div class="col-md-4 col-sm-6 col-xs-12"><p class="lead"><b>Duration : </b> 1 Hour</p></div>
<div class="col-md-1 col-sm-6 col-xs-12"></div>
<div class="col-md-4 col-sm-6 col-xs-12"><h4 class="text-muted "><code>Module Topics</code></h4></div>
<div class="col-md-1 col-sm-6 col-xs-12"></div>
<div class="col-md-2 col-sm-6 col-xs-12">
</div>
</div>
Jquery：
$(".more-less").click(function ()
{
$(this).find('i').toggleClass('glyphicon-plus-sign').toggleClass('glyphicon-minus-sign');
var active = $(this).attr('id');
var activeclass = $(this).find('i').attr('class');
var gicon= localStorage.gicon === undefined ? new Array() : JSON.parse(localStorage.gicon);
if ($.inArray(active,gicon)==-1) //check that the element is not in the array
gicon.push(active);
gicon.push(activeclass);
localStorage.gicon=JSON.stringify(gicon);
});
$(document).ready(function() {
var gicon=localStorage.gicon === undefined ? new Array() : JSON.parse(localStorage.gicon);
for (var i in gicon){
if ($("#"+gicon[i]).find('i').hasClass('glyphicon-plus-sign'))
{
$("#"+gicon[i]).html('<i class="glyphicon glyphicon-minus-sign"></i>');
}
}
});
【问题讨论】：
标签： javascript jquery html twitter-bootstrap local-storage