Question

所以我得到了以下HTML：

<div id="featured">
    <ul>
        <li><img src="<?php echo get_bloginfo( 'stylesheet_directory' ) . '/images/tmp-featured-1.jpg'; ?>" /></li>
        <li><img src="<?php echo get_bloginfo( 'stylesheet_directory' ) . '/images/tmp-featured-2.jpg'; ?>" /></li>
        <li><img src="<?php echo get_bloginfo( 'stylesheet_directory' ) . '/images/tmp-featured-3.jpg'; ?>" /></li>
        <li><img src="<?php echo get_bloginfo( 'stylesheet_directory' ) . '/images/tmp-featured-4.jpg'; ?>" /></li>
    </ul>
</div>

当我使用时：

$(function(){
    $('#featured').init();
});

触发代码。内容（在这种情况下只有单个img元素，但可能更多，如元数据或视频）尚未加载。在init中调用时的结果，宽度和高度将返回0,0。我跟踪了值，并且一旦加载图像，li将相应地调整大小。我尝试过这样的事情：

$('#featured ul li').load(function() {
    alert('its loaded');
});

但它不起作用。有人有想法吗？

Answer 1

不要使用$(function() {绑定到文档就绪处理程序，而是使用$(window).load()，因为这会加载所有图像：

$(window).load() {
    $('#featured').init();
});

jQuery：如何检测是否加载了LI元素？

1 个答案: