Question

所以我动态创建一个图像，我希望获得图像尺寸。是否可以在将图像附加到DOM之前执行此操作？目前我正在这样做：

 var arrow = $('<img src="' + parameters.arrowRight + '" />');
 arrow.load(function() {  
      console.log("size: " + $(this).height() + " " + $(this).width());
  });

但高度和宽度均报告为零。实际上正在获取图像，因为我可以在firebug中看到GET请求。

Answer 1

没有。在将任何元素附加到DOM之前，不可能获得任何元素的维度。

解决方法是为图像提供css：margin-left: -10000px。然后，您可以附加它，但它将不可见。然后，您可以根据需要获取其尺寸并使用它。

Answer 2

也许这会有所帮助：

http://api.jquery.com/load-event/

此方法是.bind（'load'，handler）的快捷方式。

当加载事件和所有子元素已完全加载时，会将事件发送到元素。此事件可以发送到与URL关联的任何元素：图像，脚本，框架，iframe和窗口对象。

例如，考虑一个包含简单图像的页面：
<img src="book.png" alt="Book" id="book" />
事件处理程序可以绑定到图像：
$('#book').load(function() {  
   // Handler for .load() called.  
});  

动态创建图像并使用jQuery检索维度

2 个答案: