jQuery 콜백이로드 함수에서 작동하지 않습니다. 호버 이벤트가 감지되지 않습니다.

Question

atahualpa 테마로 워드 프레스를 사용하고 간단한 JavaScript를 참조하는 하이퍼 링크가있어서 div에 PHP 파일의 출력을로드합니다. 이 부분은 잘 작동합니다.

<a href="javascript:loadCategory(19,1);">a link</a> 

<script type="text/javascript"> 
jQuery("#categoryposts").load("http://www.mysite.com/myphp.php?cat="+catid+"&paged="+pagedid+"", "", 
     function(responseText, textStatus, XMLHttpRequest) { 
     if(textStatus == 'error') { 
      jQuery('#categoryposts').html('<p>There was an error making the AJAX request</p>'); 
     } 
     } 
); 
    } 
</script> 

는하지만 난이 벽에 부딪 곳 그러나 이것이, DIV "#categoryposts"에로드되는 이미지 (sliding boxgrid)와 재미를 갖고 싶어. 내 PHP 출력 div 적절한 클래스와 함께 있지만 모든 jQuery에서 어떤 마우스 오버 응답을 얻을 수 없습니다. 나는 DOM이로드되는 방식과 어떻게 든 관련이 있다고 생각하지만 그것을 이해할 수는 없다. 예를 들어, 콜백 함수로 다음과 같이 좋은 물건을 추가하려고하면 alert1이 표시되지만 결코 alert2를 얻지 못하고 호버 기능이 작동하지 않습니다.

  function loadCategory(catid,pagedid) { 

jQuery("#categoryposts").load("http://www.mysite.com/myphp.php?cat="+catid+"&paged="+pagedid+"", function() 
{ 
    alert('alert1'); 
    jQuery('.boxgrid.caption').hover(function(){ 
     alert('alert2'); 
     jQuery(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160}); 
     }, function(){ 
     jQuery(".cover", this).stop().animate({top:'220px'},{queue:false,duration:160}); } 
)}, 
     function(responseText, textStatus, XMLHttpRequest) { 
     if(textStatus == 'error') { 
      jQuery('#categoryposts').html('<p>There was an error making the AJAX request</p>'); 
     } 
     } 
); 

} 

저는 하루 종일이 모든 것을 해킹하려고 시도했지만 벽을 치려고했습니다. jQuery 전문가가 있기를 바란다면 손을 빌릴 수 있습니다.

편집 : 그것이 DOM에 추가되기 전에

Answer 1

부하 콜백() 데이터를 검색 한 후에 수행 될 수있다 포맷 코드를 정리하지만. 경고 ('alert1') 이후에 다음과 같이 추가하십시오.

alert(jQuery('.boxgrid.caption').length); 

해당 시점에 컬렉션이 있는지 여부를 알려줍니다.

또 다른 가능성은 해당 이벤트 처리기를 콜백에 추가하려고 시도하는 대신 "live()"함수를 사용하는 것입니다.

Answer 2

아마도 선택자가 잘못되었을 수 있습니다.

경고 ($ ('. boxgrid.caption'). 길이)와 같은 것을 시도해보십시오. 0이 아닌 값을 반환하는지 확인 하시겠습니까?

Answer 3

jQuery의 '라이브'메소드를 사용하여 호버 기능을 바인딩 해봤습니까? 오히려 부하 콜백 내에서 가져가 결합보다,이 같은 것을 사용하여 별도로 바인딩 수 :이 요소는 사후에로드되는 경우에도, 동적 바인딩을 허용

$(".boxgrid.caption").live('hover', function(){ 
    //your hover function 
}); 

.