Jquery UI选项卡添加类

下面是我为标签设置的HTML，一切正常，我想通过将外部包含div（id = tab-wrap class = bike）的类更改为显示的任何选项卡来扩展它。 我们的想法是根据选项卡更改背景图像。

 
 
Battery Finder
 
Choose Your Application then find your battery
 
 
 
Bike
 
ATV
 
UTV
 
Snow
 
Water
 
 
 
Bike content
 
 
 
ATV content
 
 
 
UTV content
 
 
 
Snow content
 
 
 
Water content
 
 
  
  

因此，如果我选择标签“water”，我想改变以下类：

至

优雅的淡入/淡出变化会很好。 我的jquery如下

 $(document).ready(function() { $("#tabs").tabs({ fx: { height: 'toggle', opacity: 'toggle' } }); }); 

感谢帮助谢谢

Answer 1

你可以这样做，

演示

 $("#tabs").tabs({ fx: { height: 'toggle', opacity: 'toggle' }, select: function(event, ui) { $("#tab-wrap").attr('class', ui.panel.id); } }); 

Answer 2

 $("#tabs").bind("tabsselect", function(event, ui) { $("#tab-wrap").attr('class', $(ui.panel).attr('id')); } 

或者如果要在声明选项卡时绑定事件：

 $("#tabs").tabs({ select: function(event, ui) { $("#tab-wrap").attr('class', $(ui.panel).attr('id')); } }); 

查看jQuery UI选项卡演示页面的events部分。