2011-06-14 6 views
0

제목을 클릭하여 메뉴를 확장 할 때 CSS를 변경할 수 있습니다. 그러나 확장 된 다른 '헤더'는 '비활성'클래스로 변경할 수 없습니다. 다음은 내 jQuery를jQuery 아코디언 제거 형제 클래스

jQuery(document).ready(function(){ 
jQuery("dl#narrow-by-list> dd:not(:first)").hide(); 
jQuery("dl#narrow-by-list> dt a").click(function(){ 
jQuery("dl#narrow-by-list> dd:visible").slideUp("fast"); 
jQuery(this).parent().next().slideDown("fast"); 
jQuery(this).parent().removeClass("productsCat"); 
jQuery(this).parent().addClass("openSub"); 
return false; 
}); 
}); 
내 HTML

<dt class="productsCat"><a href="/" class="productsName">Category 1</a></dt> 
<dd class="subCat"><a href="<?php echo $subCategory->getUrl()?>">Sub Category 1</a></dd> 
<dt class="productsCat"><a href="/" class="productsName">Category 2</a></dt> 
<dd class="subCat"><a href="<?php echo $subCategory->getUrl()?>">Sub Category 2</a></dd> 

입니다 그리고 여기

I 클래스 "openSub"를 제거 할 때 하나의 다른 모든 형제 자매에서 기존 클래스 "productsCat"를 사용하는 방법에 대한 조언 활성?

감사합니다.

답변

1

그래서, 이것을 시도, 답장을 보내

$(function() { 
$("dl#narrow-by-list> dd:not(:first)").hide(); 
$("dl#narrow-by-list > dt").first().addClass('openSub'); 
    $(".productsName").click(function() { 

     if(!$(this).closest('dt').hasClass('openSub')) { 
      $("dl#narrow-by-list> dd:visible").slideUp("fast"); 
     } 
     $(this).parent().next().slideDown("fast"); 
     $(this).parent().each(function() { 

     $(this).parents('dl').find('dt').each(function() { 
      $(this).addClass('productsCat'); 
      $(this).removeClass('openSub'); 
     });  

     $(this).closest('dt').toggleClass('productsCat openSub'); 

    }); 
    return false; 
}); 
}); 
+0

대단히 고마워요! 그것은 완벽하게 작동합니다! :) – Sylph

+0

다행 난 도움이 될 수 :) –

0

당신이 원하는 것을 털어 놓지 않아도 될까요? 그렇지 않으면 토글 클래스를 시도해 볼 수 있습니까?

jQuery(document).ready(function() { 
jQuery("dl#narrow-by-list> dd:not(:first)").hide(); 
jQuery("dl#narrow-by-list> dt a").click(function() { 
    jQuery("dl#narrow-by-list> dd:visible").slideUp("fast"); 
    jQuery(this).parent().next().slideDown("fast"); 
    jQuery(this).parent().each(function() { 
     if (jQuery(this).hasClass('productsCat')) { 
      jQuery(this).removeClass('productsCat'); 
      jQuery(this).addClass("openSub"); 
     } 
    }); 
    return false; 
}); 

});

+0

안녕하세요, 감사합니다 .. 내 로컬에서 작동합니다. 나는 당신의 해결책을 시도했지만, 문제는 여전히 존재합니다. 나는 붕괴 된 다른 메뉴에 대해 "openSub"클래스를 제거 할 수있는 것처럼 보입니다. – Sylph

+0

내가 볼 수 있도록 업로드 할 수 있습니까? –