Question

我尝试从数据库中获取数据并将其显示在div上，在div上显示所有消息后，只有它知道div的滚动高度，它将自动滚动到div的底部作为默认的函数ASD（）。我的问题是当数据库上的消息太多时，将它们全部显示在div上需要很长时间，因此在显示所有消息之前执行asd（）。这意味着此时div的滚动高度不正确，因此自动滚动到底部失败。

$(function() { showMsg(); asd(); });

如何在执行showMsg()之前等待asd()完成渲染内容？我在showMsg（）中有jQuery.get(); .append(); .replace(); .innerHTML。

当我使用超时在3秒后执行asd（）时，问题得到解决：

$(function() { showMsg(); setTimeout(asd();, 3000); });

这就是为什么我确定当showMsg（）尚未完成加载内容时执行asd（）。

我想我知道问题出在哪里。如果在DOM准备好之前执行showMsg（），并且在DOM准备就绪后执行asd（）（此时所有消息都已呈现），那么问题就解决了。但是现在我的情况是在DOM准备好之后，所有消息仍然没有完成呈现，因为showMsg（）和asd（）仅在DOM准备就绪后执行，“执行”并不意味着“完成呈现”。如何确保showMsg（）在执行asd（）之前完成将内容呈现为div？

对于那些想知道showMsg（）内部代码的人，请点击这里：

function showMsg(){
    jQuery.get("showRspContentLive.php", function(data) {
       $('#rsp .rspcontent').append(data);
       var container = document.getElementById("rsp2");
       var text = container.innerHTML;          
       text = text.replace(/\(smile1\)/g, '<img src="images/emoticons/emobasic/smile1.gif" border="0" />')
       .replace(/\(smile2\)/g, '<img src="images/emoticons/emobasic/smile2.gif" border="0" />')
       .replace(/\(smile3\)/g, '<img src="images/emoticons/emobasic/smile3.gif" border="0" />')
       .replace(/\(haha2\)/g, '<img src="images/emoticons/emobasic/haha2.gif" border="0" />')
       .replace(/\(haha3\)/g, '<img src="images/emoticons/emobasic/haha3.gif" border="0" />')
       .replace(/\(haha5\)/g, '<img src="images/emoticons/emobasic/haha5.gif" border="0" />')
       .replace(/\(sad1\)/g, '<img src="images/emoticons/emobasic/sad1.gif" border="0" />');
       container.innerHTML = text;

       $('#rsp').scrollTop($('#rsp')[0].scrollHeight); // this is my asd() function, how to execute it only if after container.innerHTML=text; is finish loaded?   
    }); 
};

Answer 1

你的意思是

$.get("http://someurl.com", 
    function(html){
        //format the data any way you would like...
        //...

        //setm the html
        $('#myCt').html(html);

        //call your function after
        asd();
});

var asd = function(){
    //some cool stuff
}

<强>更新 如果您未在asd()函数中发出任何AJAX请求，那么您的showMsg()函数应该更新正常，否则只需链接您的callbacks ... <登记/> 例如$.get('moredata.aspx', asd);

Answer 2

在asd的回调中使用jQuery.get：

function showMsg() {
   jQuery.get("http://example.com", function(data) { 
       // Your code that uses .append(), .replace(), and .innerHTML
       asd();
   });
}

一旦asd完成执行，这将自动调用get。因此，您无需在asd处理程序中显式调用load：

$(function() { 
   showMsg(); 
});

如何使用jquery等到innerHTML完成加载后再执行其他函数？

2 个答案: