2010-03-15 2 views
4

이미 존재하는 colorbox에 페이지를로드하는 데 문제가 있습니다.현재 jQuery colorbox에 새 페이지를 어떻게로드합니까?

나는에 의해 연 colorbox 다음 코드에 의해 구속되는 링크를 클릭 한 :

$("a.ajaxAddPage").colorbox({ 
    onComplete: function(){ 
     $('ul#addPage li a').click(function() { 
      $.colorbox({href: $(this).attr('href')}); 

      return false; 
     }); 
    } 
}); 

다음 HTML은 AJAX를 통해 그 colorbox에로드 :

<div class='colorboxWindow'> 
    <ul id='addPage'> 
     <li><a href='addCat.php'>Add Category</a></li> 
     <li><a href='addPage.php' class='current'>Add New Page</a></li> 
     <li><a href='addPage2.php'>Add Another Page</a></li> 
    </ul> 

    <h3>Add New Page...</h3> 
</div> 

내가 시도하고를 클릭 할 때 현재 색상 상자에서 해당 링크 3 개를 열 수 있습니다. 위의 제 onComplete 바인딩을 사용하면 첫 번째 클릭에는 작동하지만 다음 번 클릭은 일반 페이지처럼 열립니다.

위의 코드에서 $.fn.colorbox() 호출에 onComplete 코드를 추가하면 두 번째 클릭도 같은 색상 상자에로드되지만 3 번째 코드는로드되지 않습니다.

미래의 모든 클릭을 동일한 색상 상자에서 열어 바인딩하는 방법이 있습니까? 아직 이벤트 바인딩에 대해 많이 알지 못합니다.

설명이 필요하면 질문하십시오.

답변

5

jQuery .live() 메서드 사용은 어떻습니까? 추가되는 새 요소를 처리하고 새 요소에 이벤트 처리기를 연결해야합니다. . * 정확히 내가 * 필요한 것입니다 그

$("a.ajaxAddPage").colorbox(); 

$('#cboxLoadedContent a').live('click', function() { 
    $.colorbox({href: $(this).attr('href')}); 
    return false; 
}); 
+0

: AJAX의 새로운 요소에 와야 호출 곳이기 때문에이 경우

, 우리는 그것이 #cboxLoadedContent 요소에 적용은 다음과 같이 보입니다! 몇 주 전에 jQuery의 .live() 메소드에 대해 읽은 것을 기억하지만, 결코 사용하지 않아서 내 마음이 누그러졌다. 고맙습니다! –

+1

고맙습니다. 닫는 멍청이가 없습니다. 건배! – David

+0

수정 됨. 고마워요 @ 데이비드. – htanata

관련 문제