如何确定选项卡内容何时使用jQuery UI选项卡完成呈现
如何确定选项卡内容何时使用jQuery UI选项卡完成呈现
提问于 2012-07-05 15:30:18
我正在使用jQuery UI的标签视图。我已经在下面添加了我的超文本标记语言，它是我所拥有的精简版本。
<div id="UserDetailsTabs">
<ul>
<li><a href="#tabs-1">User Details</a></li>
<li><a href="#tabs-2">Impersonation Details</a></li>
</ul>
<div id="tabs-1">
<p>Tab 1 content</p>
</div>
<div id="tabs-2">
<p>Tab 2 content</p>
</div>
</div>下面是创建选项卡的jQuery代码：
$(document).ready(function () {
$("#UserDetailsTabs").tabs();
});有没有一种方法可以在单击选项卡后确定选项卡的内容何时完成呈现？我的意思是，如果我点击tabs-2，是否有一个函数可以在所选选项卡的内容完成渲染后调用？
回答 3
Stack Overflow用户
回答已采纳
发布于 2012-07-05 15:34:06
$("#UserDetailsTabs").tabs({load: function(event, ui) {
alert('tabs loaded')
});
//This will trigger when user clicks a tab after the page load
$( "#UserDetailsTabs" ).tabs({
show: function(event, ui) { alert('clicked on the tabs'); }
});Stack Overflow用户
发布于 2012-07-05 15:36:30
例如：
$( ".selector" ).tabs({
create: function(event, ui) { ... }
});
$( ".selector" ).bind( "tabscreate", function(event, ui) {
...
});但请参阅Doc以查找适当的事件。
Stack Overflow用户
发布于 2014-12-06 04:40:59
上面coolguy的答案是正确的。我花了一段时间才找到它并整理出来，所以我想我应该发布一个更完整的例子。这在很大程度上来自于Tabs文档。唯一添加的是"load:“部分。
$(function() {
$( "#tabs" ).tabs({
active: <?php echo $tab ?>,
beforeLoad: function( event, ui ) {
ui.jqXHR.error(function() {
ui.panel.html(
"Couldn't load this tab. We'll try to fix this as soon as possible. " +
"If this wouldn't be a demo." );
});
},
load: function( event, ui ) {
//tab is loaded...now execute this code...
$(".ResultsTable").tablesorter({ widgets: ['zebra'] });
}
});
});页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11339687
复制相关文章
相似问题
腾讯云开发者
