jquery html() 回调函数
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10300765/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery html() callback function
提问by walmik
This question has been asked a couple times but not answered in such a way that it can help me with my specific issue. From a nav list, on click of an item, I'm loading some HTML content into a div using the .html()function. There is no ajax request. The HTML content has images. Hence it can take a moment to load up. And since .html()is a synchronous operation, the next line will immediately execute.
这个问题已被问过几次，但没有以可以帮助我解决我的具体问题的方式回答。从导航列表中，单击某个项目时，我正在使用该.html()函数将一些 HTML 内容加载到 div 中。没有ajax请求。HTML 内容包含图像。因此，加载可能需要一些时间。由于.html()是同步操作，下一行将立即执行。
As soon as I load contents using .html(), I'm enabling a third party custom scrollbar called tinyscrollbar. If the loaded content had images, then the scrollbar calculates the height of the content div a little earlier than the images are loaded resulting into a scrollbar that won't scroll all the way.
一旦我使用 加载内容.html()，我就会启用一个名为 tinyscrollbar 的第三方自定义滚动条。如果加载的内容包含图像，则滚动条会在加载图像之前稍微计算内容 div 的高度，从而导致滚动条不会一直滚动。
I do not want to use .setInterval(). Is there a solution for this? Is there some other function in jQuery that acts like the .html()function but has some sort of callback feature?
我不想使用.setInterval(). 有解决方案吗？jQuery 中是否还有其他一些功能类似于该.html()函数但具有某种回调功能的函数？
Thank you.
谢谢你。
采纳答案by walmik
Based on Mike Robinson's (and dystroy's) suggestion the answer to my question is:
根据迈克罗宾逊（和dystroy）的建议，我的问题的答案是：
$("#myContentDiv").html('HTML content comes here');
var contentImages = $("#myContentDiv img");
var totalImages = contentImages.length;
var loadedImages = 0;
contentImages.each(function(){
$(this).on('load', function(){
loadedImages++;
if(loadedImages == totalImages)
{
$("#myContentDiv").tinyscrollbar();
}
});
});
回答by Deb
$('#divId').html(someText).promise().done(function(){
//your callback logic / code here
});
回答by Hüseyin BABAL
In order to check whether image loaded or not you can use following;
为了检查图像是否加载，您可以使用以下内容；
<img src="your_image_path" />
<script>
$('img').load(function() {
//call_your_function();
});
</script>
回答by Joey
$(window).load(function() {
// code here
})();
