Как скрыть испорченные изображения в JavaScript?

Question

У меня есть свое изображение внутри оператора if:

if (item.image)
   historyHtml += '<a href=' + item.image + ' class="image" target="_blank"><img src="' + item.image +'" width="111px"/></a>';

Answer 1

Вы можете использовать обработчик ошибки. В встроенном виде это выглядит так:

<img src="someimage.jpg" onerror="this.style.display='none';" />

Answer 2

Как говорит @piskvor, загрузка изображения в тег img - это единственный способ узнать, не поврежден ли URL. error событие запускается, если загрузка не удалась.

Но, глядя на ваш код, возможно, имеет смысл использовать противоположный подход: скрыть <a> по умолчанию, и показать его в onload событие изображения.

Сокращенный:

<a href=".." id="image228" style="display: none">
 <img src="..." onload="this.parentNode.style.display = 'block'">
</a>