I can confirm that behavior with latest trunk...
http://dev.jqueryui.com/ticket/4110
I can offer you a workaround for now - if you use the select handler
instead of bind, it'll work as expected:
$('#container').tabs({
select: function(event, ui) {
if (ui.index == 1) alert("I'm tab-2");
}
});
--Klaus
On 10 Feb., 15:04, "frank.yao.zeal" <[email protected]> wrote:
> Hi:
>
> I met a problem about event handling with nested tabs. Here is the
> simplified source code.
>
> <div id='container'>
> <ul>
> <li><a href='#sub-container-1'><span>subcontainer</span></a></
> li>
> <li><a href='#tab-2'><span>tab2</span></a></li>
> </ul>
>
> <div id='sub-container-1'>
> <ul>
> <li><a href='#sub-tab-1'><span>sub-tab-1</span></a></li>
> <li><a href='#sub-tab-2'><span>sub-tab-2</span></a></li>
> </ul>
> <div id='sub-tab-1'>sub-tab-1</div>
> <div id='sub-tab-2'>sub-tab-2</div>
> </div>
> <div id='tab-2'>...</div>
> </div>
> And I bind "tabsselect" event to the outter container like this:
> $('#container').bind("tabsselect", function (event, ui) {
> if (ui.index == 1) alert("I'm tab-2");
> });
>
> There's no doubt that the alert will popup when I select the "tab-2",
> but the annoying thing is that when the "sub-container-1" is active
> and I select "sub-tab-2", the alert is still triggered which is out of
> my expectation.
>
> It seems the outter container captures the inner "tabsselect" event,
> any suggestions about this? Thanks.
>
> Cheer
>
> Frank Yao
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---
