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

时间:2013-09-27 10:17:43

标签: javascript php jquery css image

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

<?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>

如果我们点击图片,高度会显示。页面加载后自动无法显示

1 个答案:

答案 0 :(得分:2)

重要的是要了解它的导航器(客户端)加载图像和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/