javascript - 需要运行 javascript 后从 php 加载的动态图像

Question

我有从 php 动态加载图像的页面。图像高度是各种 px 大小(70,130,100,60)。我需要的是如何在警告框中自动获取当前在页面中查看的图像大小我尝试相同的代码不起作用。请帮忙

代码

<?php
foreach ($images as $image) { 
    ?>
<img src="<?php echo $image['url']; ?>" class="img_test" id="<?php echo $image['url']; ?>" width="70" style="max-height:70px" onclick="imagesize(this)" />
<?php
}?>

<script>
       $( window ).load(function() {

        $( ".img_test" ).each(function( index ) {
            alert('Height: '+$(this).height());
        });
       });
       function imagesize(obj){
           alert($(obj).height());
       }
</script>

点击图片高度会显示，页面加载后自动显示不上

Answer 1

重要的是要了解导航器(客户端)将加载图像和 PHP 运行到您的服务器并将文本发送到客户端。

使用监听器 .on 获取事件“点击”。

此外，使用 $(document).ready 而不是 .load 来等待图像加载

<?php foreach ($images as $image) { ?>
    <img src="<?php echo $image['url']; ?>" class="img_test" id="<?php echo $image['url']; ?>" width="70" style="max-height:70px" />
<?php } ?>


$(document).ready(function(){
    $( ".img_test" ).each(function(){
        alert('Height: '+$(this).height());
    });

    $(".img_test").on("click", function(){
           alert($(this).height());
    });
});

http://jsfiddle.net/3c9CN/