我之前使用jquery-ui tabs
扩展来加载页面片段ajax
,并隐藏或显示div
页面中的隐藏页面.这两种方法都有很好的记录,我在那里没有任何问题.
但是,现在我想用标签做一些不同的事情.当用户选择一个标签时,它应该完全重新加载页面 - 原因是每个标签部分的内容渲染起来有些昂贵,所以我不想一次性发送它们并使用普通方法切换'display:none'以显示它们.
我的计划是截取选项卡的select
事件,并让该函数通过操作document.location重新加载页面.
在select
处理程序中,我如何获得新选择的选项卡索引和它对应的html LI对象?
$('#edit_tabs').tabs( { selected: 2, // which tab to start on when page loads select: function(e, ui) { var t = $(e.target); // alert("data is " + t.data('load.tabs')); // undef // alert("data is " + ui.data('load.tabs')); // undef // This gives a numeric index... alert( "selected is " + t.data('selected.tabs') ) // ... but it's the index of the PREVIOUSLY selected tab, not the // one the user is now choosing. return true; // eventual goal is: // ... document.location= extract-url-from(something); return false; } });
我可以读取的事件或ui对象的属性是否会为新选择的选项卡或其中的锚标记提供索引,ID或对象?
或者是否有更好的方法来使用标签重新加载整个页面?
我会看一下Tabs 的事件.以下内容摘自jQuery文档:
$('.ui-tabs-nav').bind('tabsselect', function(event, ui) { ui.options // options used to intialize this widget ui.tab // anchor element of the selected (clicked) tab ui.panel // element, that contains the contents of the selected (clicked) tab ui.index // zero-based index of the selected (clicked) tab });
看起来像ui.tab是要走的路.
在jQuery UI中 - v1.9.2
ui.newTab.index()
获取活动选项卡的基数为0的索引
select: function(e, ui){var index=ui.index;}
适合我.请参阅:http://api.jqueryui.com/tabs/#events