2012-09-13 5 views
0

누군가이 아코디언이 왜 작동하지 않는지 말할 수 있습니까?동적으로 생성 된 아코디언이 작동하지 않습니다. 왜?

아약스 호출은 잘 작동하고, 아코디언 사업부는 accordion2의 DIV와 같은 구조로으로 작성되는 사업부는 해당 클래스로 장식됩니다

(아코디언가 작동 확인이!) :

<div id=​"accordion" class=​"ui-accordion ui-widget ui-helper-reset ui-accordion-icons" role=​"tablist">​ 

하지만 그 정도까지입니다. 동적으로 생성 된 컨텐츠에는 아무런 영향을주지 않습니다. div는 그냥 보통처럼 렌더링합니다. (즉, 형식이 지정되지 않고 단지 링크와 텍스트가 번갈아 가며 아코디언이 아닙니다!)

알다시피, 나는 accordion 이익.

분명히 항목이 동적으로 생성된다는 사실과 관련이 있습니다. 그러나 인터넷 검색은 비슷한 설정으로 다른 사람들이 잘 어울리는 것처럼 보입니다.

추신 : 나는 피곤하고 우둔해 무언가 어리 석을 수있다! 그것은을 초기화하기 전에

$("#accordion").accordion({ 
       header: "h3" 
      }); 

을하지만 내용이 채워 있도록 아약스 함수 안에있는 초기화를 유지 : 하나

<script> 
     $(document).ready(function() { 

      $("#accordion").accordion({ 
       header: "h3" 
      }); 

      $.ajax({ 
       type: "GET", 
       url: "/api/blog", 
       data: "{}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function(blogs) { 
        for (var i in blogs) { 
         $('#accordion').append(
          $('<div/>').append(
           $('<h3></h3>').append(
            $('<a href="#"/>').append(
             blogs[i].Title 
            ) 
           ) 
          ).append(
           $("<div/>").append(
            blogs[i].Body 
           ) 
          ) 
         ); 
        } 
        $("#accordion").accordion({ 
         header: "h3" 
        }); 
       } 
      }); 
      $("#accordion").accordion({ 
       header: "h3" 
      }); 
      $("#accordion2").accordion({ 
       header: "h3" 
      }); 
     }); 
    </script> 
</head> 
    <body> 
    <div id="accordion"></div> 
    <div id="accordion2"> 
      <div> 
       <h3><a href="#">First</a></h3> 
       <div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div> 
      </div> 
      <div> 
       <h3><a href="#">Second</a></h3> 
       <div>Phasellus mattis tincidunt nibh.</div> 
      </div> 
      <div> 
       <h3><a href="#">Third</a></h3> 
       <div>Nam dui erat, auctor a, dignissim quis.</div> 
      </div> 
     </div> 
    </body> 
</html> 

답변

0

당신은이 두 가지를 제거하려고 이 너무 많이 당신의 아코디언을 초기화 아코디언.

+0

나는 작동하지 않아서 흩어지기 시작했습니다. 여러 번 전화하면 망설이는 일은 없을 것입니다. 당신의 제안은 제가 시도하지 않은 유일한 구성 이었음에 틀림 없습니다! 하느님, 얼마나 당황 스럽습니까. 나는 그것이 DOH가 될 것임을 알고 있기 때문에 묻기를 꺼 렸습니다! 롤. 효과가 있습니다. 건배! –

+0

당신은 매우 환영합니다! 메신저는 당신을 위해 일해 기쁘다. – kingkode

관련 문제