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

试试这段代码。未经测试但应该工作。

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

如何在AJAX加载后运行jquery函数

1 个答案: