记住页面重新加载后的jQuery选项卡位置
我有一个包含一些GridView的页面。 我使用选项卡菜单将它们保存在选项卡中。 有四个选项卡。
我的问题是当页面重新加载时，选项卡会重置为第一个选项卡。
HTML：
//some gridview here
//similarly three more gridviews
jQuery的：
$(document).ready(function () { // When a link is clicked $("a.tab").click(function () { // switch all tabs off $(".active").removeClass("active"); // switch this tab on $(this).addClass("active"); // slide all content up $(".content").slideUp(); // slide this content up var content_show = $(this).attr("title"); $("#" + content_show).slideDown(); }); });
即使在页面重新加载后，如何才能显示当前单击的选项卡？
简单的解决方案是使用localStorage来持久选择：
$(document).ready(function () { function activate(tab) { // switch all tabs off $(".active").removeClass("active"); // switch this tab on tab.addClass("active"); // slide all content up $(".content").slideUp(); // slide this content up var content_show = tab.attr("title"); $("#" + content_show).slideDown(); } if (localStorage) { // let's not crash if some user has IE7 var index = parseInt(localStorage['tab']||'0'); activate($('a.tab').eq(index)); } // When a link is clicked $("a.tab").click(function () { if (localStorage) localStorage['tab'] = $(this).closest('li').index(); activate($(this)); }); });
只要单击选项卡，您就可以尝试在URL中使用主题标签，然后在代码中检查是否存在主题标签，哪个选项卡的ID与之对应。
if(window.location.hash) { $(window.location.hash).click(); }
基于： Jquery，如果URL末尾的hashtag与类名匹配，则激活脚本