some issue with nested tab while trying to implement jquery ui tab with back/forward/refresh button support -
i'm having problems browser history (using "back" , "forward" buttons) jquery's tab plugin. combined jquery ui tab , jquery bbq: button & query library plugin this.
i think problem may deal nested tabs.
you can find full code @ http://jsfiddle.net/nqgc8/
if test this, you'll see tabs @ top works fine: can navigate of tabs , go , forward @ point. not case nested tab. nested tab can found inside tab 3.
what need make work nested tabs?
the following snippets show point:
<div id="tabs"> <ul> <li><a href="#tabs-1">tab 1</a></li> <li><a href="#tabs-2">tab 2</a></li> <li><a href="#tabs-3">tab 3</a></li> </ul> <div id="tabs-1">...</div> <div id="tabs-2">...</div> <div id="tabs-3"> <div id="tabs2"> <ul> <li><a href="#tabs-31">tab 3-1</a></li> <li><a href="#tabs-32">tab 3-2</a></li> <li><a href="#tabs-33">tab 3-3</a></li> </ul> <div id="tabs-31">...</div> <div id="tabs-32">...</div> <div id="tabs-33">...</div> </div> </div> </div> <script> $(function() { $( '#tabs' ).tabs(); // adding hash url tab tracking $('#tabs').bind('tabsselect', function (event, ui) { window.location.href = window.location.protocol + '//' + window.location.hostname + window.location.pathname + ui.tab.hash; }); $( '#tabs2' ).tabs(); // adding hash url tab tracking $('#tabs2').bind('tabsselect', function (event, ui) { window.location.href = window.location.protocol + '//' + window.location.hostname + window.location.pathname + ui.tab.hash; }); // handle back/forward/refresh buttons $(window).hashchange(function () { var hash = location.hash; switch (hash) { case '#tabs-1': case '#tabs-2': case '#tabs-3': $('#tabs').tabs('select', hash); break; case '#tabs-31': case '#tabs-32': case '#tabs-33': $('#tabs').tabs('select', '#tabs-3'); $('#tabs2').tabs('select', hash); break; default: $('#tabs').tabs('select', '#tabs-1'); location.hash = '#tabs-1'; } }); $(window).hashchange(); }); </script>
this works me in chrome. browser trying with?
Comments
Post a Comment