ajax 성공 콜백에서 live()를 사용하는 방법

나는 AJAX를 사용하여 기사를 표시하는 WordPress 사이트에서 일하고 있습니다. 성공 콜백에 jquery 코드를 추가했습니다. 내 필요 중 하나는 마우스 위에 이미지를 표시하는 것입니다. 내 모든 코드는 마우스 오버 효과를 제외하고 작동합니다.ajax 성공 콜백에서 live()를 사용하는 방법

function loadArticle(pageNumber, loop, term){  
    $.ajax({ 
     url: ajax_var.url, 
     type:'POST', 
     data: someData, 
     success: function(html){ 
      // This will be the div where our content will be loaded 
      $("#content").append(html);  

      // Zoom box 
      $('img.static').hide(); 
      $(".ad-preview").live({ 
       mouseover: function() { 
        $(this).find('img.static').stop().fadeIn(); 
       }, 
       mouseout: function() { 
        $(this).find('img.static').stop().fadeOut(); 
       } 
      }); 

      // Other stuff... 
     }); 

     return false; 
    } 

});

과 HTML :

<div class="ad-preview"> 
    <a target="_blank" href=""> 
     <img src="img/zoom.png" /></a>    
    </a> 
</div>

이 효과를 구현하는 좋은 방법은 무엇입니까

그래서이 내 아약스 기능입니다? 즉, 아닌 document.ready 전화 내부 또는 다른 함수 내부에서 그렇게 -

출처

2013-01-24 Adrien G

.live 당신은 JS의 기본 수준에서, 아약스 호출 외부에서이 놓여지는 .on

로 대체 활성 리스너입니다. 그것은 아약스를 통해로드 된 dom 요소에서 작동합니다.

출처

2013-01-24 00:11:43

설명해 주셔서 감사합니다. 또 다른 질문이 있습니다. 코드 최적화에 관한 것입니다. 성공 콜백에는 많은 코드가 있습니다. 특정 요소에 대해 jquery-ui 슬라이더를 사용하여 양식을 제출 한 후 실행되는 투표 프로세스 (AJAX 사용)도 있습니다. 다른 js 파일을 만들어 HTML과 상호 작용하는 모든 코드 내에 넣어야합니까? AJAX를 통해로드 된 관련 요소 (document.ready 호출 안쪽)? –

사이트 크기에 따라 다릅니다. 거대한 사이트를 운영하지 않는 한 그 수준까지 최적화 할 실질적인 이유는 없습니다. 하지만 하루에 약 20,000 명의 사용자가 몇 줄의 js 파일을 다른 파일로 옮기는 것이 실제로 도움이되지는 않습니다. 요청시에만로드됩니다. 또한 사이트가 아약스에 얼마나 의존하고 있는지에 달려 있습니다. 결국 당신은 몇 k를 저장하는 데 필요한 것보다 더 많은 작업을 할 수 있습니다. 소규모 사이트가 필요로하는 유일한 일반 최적화는 수정 사이를 축소하는 것입니다. –

무슨 뜻인지 알 겠어. 다시 고마워요 :) –

먼저 live이 아닌 on을 사용해야합니다. 둘째, 위임 된 핸들러는 콜백에 적용 할 필요가 없습니다. 페이지에 남아있는 상위 요소로 위임되므로 페이지로드시 적용 할 수 있습니다.

$("body").on('mouseover', '.ad-preview', function() { 
      $(this).find('img.static').stop().fadeIn(); 
    }) 
    .on('mouseout', '.ad-preview', function() { 
      $(this).find('img.static').stop().fadeOut(); 
    });

출처

2013-01-24 00:12:28 tvanfosson

답장을 보내 주셔서 감사합니다. –

ajax 성공 콜백에서 live()를 사용하는 방법

답변

관련 문제