2009-07-07 7 views
0

두 개의 독립적 인 아코디언을 설정하는 데 문제가 있습니다. 독립적으로 열거 나 닫아야합니다. accordion1은 accordion1에 중첩되어야합니다 (아래 참조).
지금 열리는 것은 서로 겹치고 IE가 'accordion 1 아래의 텍스트'를 덮어 쓰는 것입니다. 이것은 일어나서는 안됩니다.

개선해야 할 아이디어가 있습니까?

많은 도움을 주셔서 감사합니다!
건배Jquery 아코디언 중첩 문제

<script type="text/javascript"> 

     $(document).ready(function() { 
       $("#accordion1").accordion(); 
       $("#accordion2").accordion(); 

       $('#accordion1 .q1').click(function() { 
        $(this).next().toggle(); 
        return false; 
       }).next().hide(); 

       $('#accordion2 .q2').click(function() { 
        $(this).next().toggle(); 
        return false; 
       }).next().hide(); 

     }); 

    </script> 
    <style type="text/css"> 

       #sub1 { height:100px; background: #FF0000;} 
       #sub2 { height:100px; background: #FF00FF;} 
    </style> 

    </HEAD> 
    <BODY> 

     <div id="accordion1"> 
      <div> 
       <a class="q1" href="#"> 
       accordion 1 
       </a> 
       <div id="sub1"> 
       <div id="accordion2"> 
        <div> 
         <a class="q2" href="#"> 
         accordion 2 
         </a> 
         <div id="sub2"> 
         222222222 
         </div> 
        </div> 
       </div> 
       text below accordion 2 
       </div> 
      </div> 
     </div> 
     text below accordion 1 
    </BODY> 
</HTML> 

답변

2

사용 #accordian1 > div > .q1 대신 #accordian1 .q1, 그 선택은 또한뿐만 아니라 두 번째 아코디언의 자식을 일치하기 때문이다.