Jquery src为空时无法设置IMG宽度？

我有一个问题，我的第二个图像出现在我的第一个图像应该出现的地方，这会在第一个图像实际存在时导致闪烁效果（从定位）。我想这会非常简单，所以我很想接受这方面的教育

我的HTML

<img id="image1" src="" width="32"/>
<img id="image2" src="" width="32"/>

我尝试将图像封装在固定宽度的div中（像这样），但没有效果，div的宽度也没有保持固定

<div style="width: 32px; display: inline;"><img id="image1" src="" width="32"/></div>
<div style="width: 32px; display: inline;"><img id="image2" src="" width="32"/></div>

---

我不确定你的第一点html是否能用。。。不管怎样，由于没有设置高度，我不确定在渲染屏幕时是否留出了空间

您可能需要为每个图像的显示方式设置一个类

.holder {
     min-width:32px;
     min-height:32px;
     position:relative;
}

html

 <img id="image1" class="holder" src=""/>
 <img id="image2" class="holder" src=""/>

---

我不确定，但您可以尝试将div样式上的显示值更改为inline block

该

src

不是“空”的，它是一个相对URI，解析为当前文档的URI，因为这是一个HTML文档，它不是一个图像，因此将引发错误

根据浏览器的不同，它可能生成或不生成与您为无效图像指定的大小相同的框

解决方案是不将没有包含实际图像URI的src属性的图像（通过HTML或JS）插入DOM

我尝试将图像封装在固定宽度的div中（像这样），但没有效果，div的宽度也没有保持固定

<div style="width: 32px; display: inline;"><img id="image1" src="" width="32"/></div>
<div style="width: 32px; display: inline;"><img id="image2" src="" width="32"/></div>

---

您已将div元素显式设置为

display:inline

。不适用于内联元素。

这很有效，谢谢。如果有人有时间的话，我想知道为什么这不能像我以前那样工作。我会等着把这个标记为正确答案，因为这个答案可能会出现，但万一将来有人读到这个：这确实达到了我的目标。这里有一些关于内联元素和块元素的更多信息，这对你很有帮助：谢谢，这很有意义。最后，我修改了代码，将div包含在内联块中。

$(function(){
    //$('#image1').attr('src','http://www.w3schools.com/html/smiley.gif');
    $('#image2').attr('src','http://www.w3schools.com/html/smiley.gif');
});