Javascript 获取图像大小并相应地设置div大小

我有一个dijit对话框，需要根据图像大小设置对话框大小

为了实现这一点，我需要在创建对话框之前加载图像，并从图像中获取属性。Image

onload（）

方法无法满足我的要求，因为在创建对话框并将图像放置在其上之前，我需要该大小。有人能告诉我解决这个问题的方法吗

提前谢谢你的建议

Image onload（）方法无法满足我的要求，因为我需要 创建对话框并在其上放置图像之前的大小

三个步骤：

在样式表中为图像设置默认值

display:none

，以便在加载时不会显示（或占用任何空间）

让javascript检测图像何时加载，然后运行函数设置对话框大小

使用javascript将

display:none

替换为

display:block

或

display:inline block

Image onload（）方法无法满足我的要求，因为我需要 创建对话框并在其上放置图像之前的大小

三个步骤：

在样式表中为图像设置默认值

display:none

，以便在加载时不会显示（或占用任何空间）

让javascript检测图像何时加载，然后运行函数设置对话框大小

使用javascript将

display:none

替换为

display:block

或

display:inline block

---

可以在实例化对话框之前获取图像属性

请注意，

对话框

在窗口小于其宽度时dijit调整大小（因此无法强制使用固定值）

下面是运行示例后的一个片段单击->完整页面

require（[“dijit/Dialog”，“dijit/form/Button”，“dojo/domReady！”]，函数（Dialog，Button）{
var imageUrl=”https://cdn.elegantthemes.com/blog/wp-content/uploads/2015/02/custom-trackable-short-url-feature.png";
变量对话框
var image=新图像（）；
//传递src映像url以调用onload函数而不添加到dom
image.src=imageUrl；
image.onload=函数（e）{
控制台.日志（图像.宽度）；
控制台.日志（图像.高度）；
对话框=新建对话框({
标题：“我的对话”，
/*如果你想传递图像*/
内容：“，
样式：“宽度：”+image.width+“px”
}); 
}
var btn=新按钮({
标签：“给我看！”，
onClick:function（）{
dialog.show（）；
}  
}，“btn”）.startup（）；
});
您可以在实例化对话框之前获取图像属性

请注意，
对话框
在窗口小于其宽度时dijit调整大小（因此无法强制使用固定值）

下面是运行示例后的一个片段单击->完整页面
require（[“dijit/Dialog”，“dijit/form/Button”，“dojo/domReady！”]，函数（Dialog，Button）{
var imageUrl=”https://cdn.elegantthemes.com/blog/wp-content/uploads/2015/02/custom-trackable-short-url-feature.png";
变量对话框
var image=新图像（）；
//传递src映像url以调用onload函数而不添加到dom
image.src=imageUrl；
image.onload=函数（e）{
控制台.日志（图像.宽度）；
控制台.日志（图像.高度）；
对话框=新建对话框({
标题：“我的对话”，
/*如果你想传递图像*/
内容：“，
样式：“宽度：”+image.width+“px”
}); 
}
var btn=新按钮({
标签：“给我看！”，
onClick:function（）{
dialog.show（）；
}  
}，“btn”）.startup（）；
});

您可以使用body.onload（）显示您的尝试。如果在创建对话框之前需要大小，请在图像加载时创建它，而不是在可以加载图像之前（
var i=new image（）；i.src=“url”
），等待它加载完毕，然后创建对话框，然后将图像添加到其中。它是缓存的，所以会立即显示。@PatrickEvans我正在使用dojo框架。我有两个模板化的.js文件：比方说-SmallThumbnail.js和LargeThumbnail.js。我有一个main.js文件，其中一个叫做onclick（）。根据图像的大小创建dijit.对话框并设置高度/宽度。设置“高度：自动”在对话框上不起作用。这就是为什么在加载之前我需要图像的大小。我们不能在内部加载一个图像（不放置在dom上）来获取属性吗？您可以使用body.onload（）显示您已经尝试过的内容。如果在创建对话框之前需要大小，请在图像加载时创建它，而不是在可以加载图像之前（
var i=new image（）；i.src=“url”
），等待它加载完毕，然后创建对话框，然后将图像添加到其中。它是缓存的，所以会立即显示。@PatrickEvans我正在使用dojo框架。我有两个模板化的.js文件：比方说-SmallThumbnail.js和LargeThumbnail.js。我有一个main.js文件，其中一个叫做onclick（）。根据图像的大小创建dijit.对话框并设置高度/宽度。设置“高度：自动”在对话框上不起作用。这就是为什么在加载之前我需要图像的大小。我们不能在内部加载一个图像（不放置在dom上）来获取属性吗？