자바 스크립트 아코디언 효과가 작동하지 않습니다. 가상 클라스와 관련이 있습니까?

Question

이 비디오를 기반으로 JavaScript로 아코디언 효과를 만들려고 시도했지만 선택기 링크 대신 입력 버튼을 사용하는 것과 같은 몇 가지 사항을 변경했습니다. 그러나 어떤 이유로 그것은 작동하지 않습니다. Firefox 오류 콘솔은 사용하려고 할 때마다 unknown pseudo-class or pseudo-element "visible"을 출력합니다. 뭐가 문제 야?

$("div.example").hide(); 
$("input.exampleButton").click(function(){ 
    $("div.example:visible").slideUp("slow"); 
    $(this).parent().next().slideDown("slow"); 
    //return false; if you don't want the link to follow 
}); 

다음은 HTML

input type="button" value="See An Example" class="exampleButton" /> 
<div class="example"> 
    ...content 
</div> 
input type="button" value="See An Example" class="exampleButton" /> 
<div class="example"> 
    ...content 
</div> 

Answer 1

당신은 콘솔에서 경고를 무시할 수 있습니다. 코드가 작동하지 않는 이유는 마크 업 구조가 Javascript에 의해 수행 된 순회와 일치하지 않기 때문입니다. 각 <input>은 <div> 내부에 있어야하므로 parent().next()에 대한 호출이 올바르게 입력에서 다음에 오는 <div class="example">으로 바뀝니다. 또한 입력에 < 개구부가 누락되어 있지만 복사/붙여 넣기 오류라고 가정합니다.

근무 태그 : 도움을

<div> 
    <input type="button" value="See An Example" class="exampleButton" /> 
</div> 
<div class="example"> 
    ...content 
</div> 
<div> 
    <input type="button" value="See An Example" class="exampleButton" /> 
</div> 
<div class="example"> 
    ...content 
</div>