我有一个引导手风琴,我尝试在回发时重新打开最后打开的窗格,就像有人单击我页面上的保存按钮一样。我找到了这个解决方案:在页面刷新/导航时保留 Twitter Bootstrap 折叠状态
但我无法对此发表评论,因为我作为用户没有足够的积分。
由于某种原因我无法使该功能工作:
//when a group is shown, save it as the active accordion group
$("#applicant-accordion").bind('shown', function () {
var active = $("#applicant-accordion .in").attr('id');
$.cookie('activeAccordionGroup', active)
});
我正在尝试在 FireBug 中测试它,但我从未到达 var active 的行。它停在 $("#applicant-accordion).bind 行。自从我的 jQuery 版本为 1.7.2 以来,我尝试将 .bind 更改为 .on
我很茫然,希望你能指导我找到解决方案。我正在 ASP.NET 中构建它。
<script src="../Scripts/jquery-1.7.2.js" type="text/javascript"></script>
<script src="../Scripts/bootstrap/js/bootstrap.js" type="text/javascript" />
<link href="../Scripts/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://raw.github.com/carhartl/jquery-cookie/master/jquery.cookie.js" />
<script type="text/javascript">
$(document).ready(function () {
var last = $.cookie('activeAccordionGroup');
if (last != null) {
//remove default collapse settings
$("#applicant-accordion .panel-collapse").removeClass('in');
//show the account_last visible group
$("#" + last).addClass("in");
}
});
//when a group is shown, save it as the active accordion group
$("#applicant-accordion").on('shown', function () {
var active = $("#applicant-accordion .in").attr('id');
$.cookie('activeAccordionGroup', active)
});
</script>
<div class="accordion" id="applicant-accordion">
<div class="accordion-group">
<div class="accordion-heading">
<a class="btn accordion-toggle" data-toggle="collapse" data-parent="#applicant-accordion" href="#uInfo">Applicant information</a>
</div>
<div id="uInfo" class="accordion-body collapse in">
<div class="accordion-inner">
</div>
</div>
</div>
<asp:Panel Visible="false" runat="server" ID="assistancePanel">
<div class="accordion-group">
<div class="accordion-heading">
<a class="btn accordion-toggle" data-toggle="collapse" data-parent="#applicant-accordion" href="#meetgreet">Accommodation and Meet & Greet information</a>
</div>
<div id="meetgreet" class="accordion-body collapse">
<div class="accordion-inner">
</div>
</div>
</div>
</asp:Panel>
<div class="accordion-group">
<div class="accordion-heading">
<a class="btn accordion-toggle" data-toggle="collapse" data-parent="#applicant-accordion" href="#application">Application, documents & options</a>
</div>
<div id="application" class="accordion-body collapse">
<div class="accordion-inner">
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="btn accordion-toggle" data-toggle="collapse" data-parent="#applicant-accordion" href="#comments">Comments</a>
</div>
<div id="comments" class="accordion-body collapse">
<div class="accordion-inner">
</div>
</div>
</div>
<div class="accordion-group">
<div class="accordion-heading">
<a class="btn accordion-toggle" data-toggle="collapse" data-parent="#applicant-accordion" href="#changelog">Changelog</a>
</div>
<div id="changelog" class="accordion-body collapse">
<div class="accordion-inner" runat="server" id="changelogItems">
</div>
</div>
</div>
</div>
只是发布我的解决方案:
添加了一个隐藏字段:
<asp:HiddenField ID="hfAccordionIndex" runat="server" />
页面底部的 JavaScript 确保 DOM 具有元素:
<script type="text/javascript">
$(document).ready(function () {
var last = $('#<%= hfAccordionIndex.ClientID %>').val();
if (last != null && last != "") {
//remove default collapse settings
$("#applicant-accordion .collapse").removeClass('in');
//show the account_last visible group
$("#" + last).collapse("show");
}
});
//when a group is shown, save it as the active accordion group
$("#applicant-accordion").on('shown', function () {
var active = $("#applicant-accordion .in").attr('id');
$('#<%= hfAccordionIndex.ClientID %>').val(active);
});
</script>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)