设置img src属性时宽度和高度不会改变

Question

使用Javascript更改src ...第一次正确设置宽度和高度属性。第二次他们不改变。为什么？

所以我有这个空白图像在我的网页... <img id="imgCropImage" />

这样的想法是，用户每次上传的图像，上传的UploadComplete回调将这个图片的src设置为具有图像刚刚上传，以便它可以裁剪。 我然后使用此图片的高度和宽度属性为了创建一个放大的裁剪预览。

它第一次效果很好。浏览器或DOM或东西自动设置图像加载后通过DOM访问的img的高度和宽度属性。这很漂亮。

如果用户上传了错误的图片，我想让他们上传不同的图片。但是，这次，通过javascript访问的img宽度和高度属性与之前的图像保持一致。新图像正确显示在它自己的宽度和高度上，只是标签的属性不会随着新的src一起更改。

有谁知道为什么会发生这种情况？或者甚至更好，如何在加载新的src时确定性地获取img的高度和宽度？

我< 3 stackoverflow和我< 3你。

Answer 1

如何“移除”高度和宽度属性。

$('#imgCropImage').removeAttr('height'); 
$('#imgCropImage').removeAttr('width'); 

这应该“重置”它。 （如果你使用的是JQuery）。

Answer 2

您是否尝试用新的src替换之前的图像？

var newImg = document.createElement('IMG'); 
    newImg.src = newSrc; 
    oldImg.parentNode.replaceChild(newImg, oldImg);