2012-09-13 139 views
1

我试过使用$element.width()$element.height(),两者似乎都无法帮助检索ajax加载图像的值。我怎样才能得到这些与jQuery或常规JS?图像在CSS中没有设置。获取ajax加载图像的大小

+0

你能成为一个更具体一点关于你所说的“AJAX加载图片”是什么意思? –

+0

我认为只有在元素上指定了宽度和高度标签,jQuery和javascript才会起作用。如果您可以在服务器端脚本中执行此操作,请执行此操作并重试。否则,您可以尝试使用服务器端脚本查询图像,并将结果回传到jquery中。 – user1477388

+0

我使用jQuery的load()函数加载图像。我不是简单地从服务器端输出获取宽度和高度的原因是我不想设置任何图像大小。我尝试附加两个数据属性(包含值),它的工作原理,但它似乎是错误的。 –

回答

3

当您加载内容,在阿贾克斯成功使用这样的事情

var real_image_sizes = {}; 
$('your loaded images').one('load', function() { 
    //get real image size 
    real_image_sizes.width = this.width; // Note: $(this).width() will not 
    real_image_sizes.height = this.height; // work for in memory images. 
}).each(function() { 
    if(this.complete) $(this).load(); 
}); 
+1

因此,如果我理解正确,我需要在图像放入DOM之前获取宽度和高度? –

+0

将图像放入dom后,图像加载完成后。你加载你的图像,把它们放到DOM中,然后执行加载,直到图像完全加载。 –

+0

啊!他们需要加载。谢谢! –

1

只使用负载处理!

var $img = $('<img/>').attr('src','img_url.jpg').load(function(){ 
    console.log('width: ', $img.width(), ' height: ', $img.height()); 
}); 
$('body').append($img); 

这里是一个fiddle

+0

感谢您的建议! –