AJAX로드 후 jquery 함수를 실행하는 방법

Question

이미지를로드하는 기본 AJAX 기능이 있습니다. 네이티브 AJAX 성공적으로로드 한 후 어떻게 Jquery 함수를로드 할?

여기 내 AJAX입니다 :

function loadImage() { 
    var xmlhttp; 

    if(window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } 
    else { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange = function() { 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById("imageLoco").innerHTML = xmlhttp.responseText; 
      document.getElementsByClassName("media-pv").style.height = document.getElementsByClassName("media-pv").clientWidth; 
     } else { 
      document.getElementById("imageLoco").innerHTML = "<img src='images/loader.gif' />"; 
     } 
    } 

    var url = "get_media.php"; 

    xmlhttp.open("GET",url,true); 
    xmlhttp.send(); 
} 

을 그리고 여기 JQuery와 함수이다, 내가로드 할 것을 :

$('.media-pv').css({      
    height : $('.media-pv').width() 
}); 

내가 $(document).ready(function(){ ... }) 후 내 AJAX를 놓고, jQuery를하지 .media-pv 수준의 높이를 변경합니다. 어떻게 처리할까요?

고맙습니다.

Answer 1

이 코드를 사용해보세요. 테스트되지는 않았지만 일해야합니다. jQuery.ajax()`를 사용 ... 기본 자바 스크립트와 jQuery를 혼합하는 이유

function loadImage() { 
    var xmlhttp; 

    if(window.XMLHttpRequest) { 
     xmlhttp = new XMLHttpRequest(); 
    } 
    else { 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 

    xmlhttp.onreadystatechange = function() { 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
      document.getElementById("imageLoco").innerHTML = xmlhttp.responseText; 
      //document.getElementsByClassName("media-pv").style.height = document.getElementsByClassName("media-pv").clientWidth; 
      //[updated code] 
      changeHeight(); 
     } else { 
      document.getElementById("imageLoco").innerHTML = "<img src='images/loader.gif' />"; 
     } 
    } 

    var url = "get_media.php"; 

    xmlhttp.open("GET",url,true); 
    xmlhttp.send(); 
} 

function changeHeight(){ 

    if(domReady == true){ 
     $('.media-pv').css({      
      height : $('.media-pv').width() 
     }); 

     if(tempInterval){ 
      clearInterval(tempInterval);  
     }   

    }else{ 
     tempInterval = setInterval(changeHeight,100);  
    } 


} 

var domReady = false; 
var tempInterval; 
$(document).ready(function(){ 
    domReady = true; 
});