HTML/Javascript从img src属性中删除数据

isl*_*lon 8 html javascript image

我的页面中有一个空的img <img ... src=""/>

当事件发生时,我将img属性设置为内联png数据:

<img ... src="data:image/png;base64,..."/>

当另一个事件发生时,我设置src到什么(删除图片):myImg.src = ""

问题是:当我将src设置为空时,img不会重新加载.如果我隐藏了img,请等一段时间然后重新显示它有效,但这是一个丑陋的黑客......

PS:我不想设置默认的"空白"图像我需要它真的是空白的(src ="").

编辑:我的javascript:

biometria.setImage = function(png) {
    if(png)
        bioCanvas.src = 'data:image/png;base64,' + png;
    else
        bioCanvas.src = '';
};
Run Code Online (Sandbox Code Playgroud)

Edit2:浏览器:谷歌浏览器18.0.1025.162 Ubuntu 12.04

Ali*_*Ali 8

我通过打击代码处理这个问题并为我工作:

document.getElementById('tst').removeAttribute('src');
Run Code Online (Sandbox Code Playgroud)


Ste*_*eve 6

从技术上讲,图像标记需要具有src属性,并且它应该不为空.但是,当src属性为空时,W3C规范并不清楚如何处理这些情况.因此,每个浏览器都会略微区别地处理这种情况.

实际上,由于缺乏规范,可能会产生很多问题,你的问题只是其中之一.可以在此处找到有关此问题的更详细信息.

正如其他人所指出的那样,通过CSS隐藏/显示图像更为可取(可见性:如果你想保持占用的空间则为none;如果你想让图像完全消失,则显示:none).或者,您可以使用JS删除完整的图像标记,并在想要将其插入时创建新图像.

  • @islon注意,如果将img设置为display:none或visibility:hidden,并且确实具有有效的src,它仍会下载! (2认同)