jquery - 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()
});

我把我的 AJAX 放在 之后$(document).ready(function(){ ... })，而 Jquery 不会改变.media-pv班级高度。如何处理？

谢谢..

Answer 1

试试这个代码。未经测试，但应该可以工作。

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;
});