토글 기능이 제대로 작동하지 않습니다.

콘텐츠를 표시하거나 숨기려면 간단한 토글 기능이 있습니다. 그것은 H2의 클릭으로 촉발되고 "모두 표시"/ "모두 숨기기"기능이 추가되었습니다.토글 기능이 제대로 작동하지 않습니다.

내가 겪고있는 문제는 두 개의 컨텐츠 영역을 확장 한 다음 "모두 표시"를 클릭하면 열려있는 것을 숨기고 숨겨진 것만 표시하는 대신 숨겨진 것만 표시한다는 것입니다. 나는 ".toggle"함수가 발사하고 열려있는 것들을 토글함으로써 발생하는 것이 닫혔다는 것을 알고있다. 이론적으로 나는 확장 된 클래스에 클래스를 추가하고 어떤 클래스가 열려 있는지 확인하고 그 클래스를 토글하지 않고 숨겨진 클래스를 확장해야만한다고 생각합니다. "Close all"버튼으로 닫으려면 역관계를해야합니까?

어떻게 해결할 수 있습니까? example is here

출처

2012-01-31 Dirty Bird Design

@Nanne 및 ShankarSangoli 최고! 일 x는 저를 교정하기위한 것입니다. 나는 정답으로 둘 다 표시 할 수 있으면 좋겠다. 누가 먼저 대답 했는가. 고마워, 정말 고마워. Esp : Shankar의 멋진 데모. –

에 대한 toggle()를 사용 toggle은 요소의 상태 (표시/숨기기)를 전환됩니다 때문입니다.이 경우 slideToggle를 사용하지 않는 대신 조건 slideUp/slideDown를 사용합니다.이보십시오.

$(".toggleAll").click(function() { 
    if($(this).text() == 'Show All'){ 
     $(".faq p").slideDown("slow"); 
     $(this).text('Hide All'); 
     $(".faq h2").addClass('active'); 
    } 
    else{ 
     $(".faq p").slideUp("slow"); 
     $(this).text('Show All'); 
     $(".faq h2").removeClass('active'); 
    } 
});

Demo

출처

2012-01-31 21:49:30 ShankarSangoli

은 크게 데모와 지식을 높이 평가했습니다. –

단순 : 모두 표시 버튼에는 "toggle()"을 사용하지 말고 "show()"을 사용하십시오. 숨기기 - 모든 동감, "사용 hide()".

을 단지 하나의 클릭

출처

2012-01-31 21:43:09 Nanne

토글 기능이 제대로 작동하지 않습니다.

답변

관련 문제