2014-05-15 3 views
1

확장/닫기 버튼을 제어하는 ​​jquery를 수정하려고합니다. 문제가되는 jquery를 두 번째 코드 블록에 넣었습니다. 이 fiddle을 클릭하면 내가 말하는 것에 대해 더 잘 알 수 있습니다. 지금 버튼이 제대로 작동하지 않습니다와 나는 지금 .faq 행> H2 및 .faq 행> H3에Jquery 닫기/모두 펼치기 버튼

var faqCategories = $('.categories'); 
var faqContainers = faqCategories.find('.container-toggle').hide(); 

var faqRow = faqCategories.find('.faq-row'); 
var faqRowItems = faqRow.find('.faq-row-answer').hide();  

$('.categories > h2').click(function() { 
    faqCategories.removeClass('active'); 
    faqContainers.slideUp(); 
    $(this).parent(faqCategories).addClass('active') 
    $(this).next().slideDown(); 
    return false; 
}); 

$('.faq-row > h3').click(function() { 
    faqRow.removeClass('active'); 
    faqRowItems.slideUp(); 
    $(this).parent(faqRow).addClass('active') 
    $(this).next().slideDown(); 
    return false; 
}); 

(즉, 의미가있는 경우) 더블 토글을 설정 관리 그리고 한 불쾌한 jquery.

$(".category-expand .expandAll").click(function() { 
    $(".closeAll").toggleClass("hider"); 
    $(this).toggleClass("hider");  
    $(this).closest('.mainContent').find('.container-toggle').slideToggle('fast'); 
}); 

$("category-expand .closeAll").click(function() { 
    $(".expandAll").toggleClass("hider"); 
    $(this).toggleClass("hider"); 
    $(this).closest('.mainContent').find('.container-toggle').slideToggle('fast'); 
}); 

답변

0

closeAll 버튼을 onClick하면 CSS 선택기에 '.'이 누락됩니다. 클래스 선택 카테고리-확장하기 전에, 그것은 것과 같아야합니다 :

여기
$(".category-expand .closeAll").click(function() { 
$(".expandAll").toggleClass("hider"); 
$(this).toggleClass("hider"); 
$(this).closest('.mainContent').find('.container-toggle').slideToggle('fast'); }); 

업데이트 된 JSFiddle입니다 : http://jsfiddle.net/aS8wN/4/