jQuery - проблемы с селектором при скрытии содержимого вкладки

Question

У меня проблемы с скрытием содержимого некоторых элементов div в настройке псевдо-вкладки - мой код на http://rudderlive.bito.org.nz/employment_dev2.asp

Tab 1 to Tab 2 работает нормально, но переход от Tab 2 к Tab 3 не скрывает div из Tab 2, а переход от Tab 3 обратно к Tab 1 не скрывает Div 2 или 3 div.

Мой код выглядит следующим образом - но он имеет больше смысла при просмотре вместе с HTML (на странице выше) ...

$('ul.tabNav a').click(function() {
    var curChildIndex = $(this).parent().prevAll().length + 1;
    $(this).parent().parent().children('.current').removeClass('current');
    $(this).parent().addClass('current');
    $('div.tabContainer').children('.current').fadeOut('fast',function() {
        $(this).removeClass('current');
        $('div.tabContainer').children('div:nth-child('+curChildIndex+')').fadeIn('normal',function() {
        $(this).addClass('current');
        });
    });
    return false;
});

Answer 1

что-то не так с помещением класса current в новый видимый контент. так что вы можете попробовать этот скрипт.

$('div.tabContainer')
  .children('.current')
  .removeClass('current') // put here
  .fadeOut('fast',function() {

    // $(this).removeClass('current'); remove from here

    $('div.tabContainer')
      .children('div:nth-child('+curChildIndex+')')
      .addClass('current') // put here
      .fadeIn('normal',function() {
        // $(this).addClass('current'); remove from here
      });
  });

надеюсь, что это поможет

Answer 2

Этот код работает (проверено с помощью firebug). $(this), похоже, не работает в ваших обратных вызовах.

$("ul.tabNav a").click( function()
{
    var curChildIndex = $(this).parent().prevAll().length;

    $(this).parent().siblings().removeClass( "current" );
    $(this).parent().addClass( "current" );

    var tabContent = $(this).parents( "ul.tabNav:first" ).next( ".tabContainer" ).children( ".current" );
    tabContent.fadeOut( "fast", function()
    {
        //console.log( $(this) ); --> returns the instance of the window

        tabContent.removeClass( "current" );
        var newTabContent = tabContent.parent().children( "div:eq("+ curChildIndex +")" );

        newTabContent.fadeIn( "fast", function()
        {
            newTabContent.addClass( "current" );
        } );
    } );

    return false;
} );