javascript – 如何在选择jQuery选项卡时正确更新URL哈希?

前端之家收集整理的这篇文章主要介绍了javascript – 如何在选择jQuery选项卡时正确更新URL哈希?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
HTML
<div id="tabs">
    <ul>
        <li><a href="#settings">Settings</a></li>
        <li><a href="#fields">Fields</a></li>
    </ul>
    <div id="settings">
        //Tab Contents
    </div>
    <div id="fields">
        //Tab Contents
    </div>
</div>

如何应用jQueryUI的Tab功能并强制它在选择新选项卡时更新URL哈希?

解决方法

除了更改选项卡更改上的哈希值(使用shruggernaut的回复中的beforeActivate事件),更新哈希更改的活动选项卡(即启用浏览器历史记录,后退/前进按钮和用户手动键入哈希)非常有用:
$(window).on('hashchange',function () {
  if (!location.hash) {
    $('#tabs').tabs('option','active',0); // activate first tab by default
    return;
  }
  $('#tabs > ul > li > a').each(function (index,a) {
    if ($(a).attr('href') == location.hash) {
      $('#tabs').tabs('option',index);
    }
  });
});
原文链接:https://www.f2er.com/jquery/155809.html

猜你在找的jQuery相关文章