атрибут alt для тега изображения в html

Сценарий:

 <img src="filepath" alt="image not found">

Это гарантирует, что если файл не будет найден в пути, текст будет загружен.....

Вопрос: Вместо альтернативного текста можно ли загрузить изображение?? есть ли какие-либо теги, которые легко послужат моей цели, и есть ли какие-либо пользовательские функции javascript, которые можно было бы указать в теге #alt ??


person Raghu    schedule 27.03.2013    source источник
comment
Вместо этого нельзя загрузить изображение. (Какие у вас гарантии, что это изображение будет найдено и загружено? Хотите ли вы затем установить альтернативное изображение для альтернативного изображения? и т. д.)   -  person sevenseacat    schedule 27.03.2013
comment
Обратите внимание, что атрибут alt в основном является функцией специальных возможностей. В среде, где невозможно отобразить изображения (например, программа чтения с экрана), другое изображение не является адекватной заменой. Я предлагаю вам использовать атрибут по назначению (предоставить краткое описание изображения, если это применимо, какое изображение не найдено, не является) и найти другой способ обнаружения отсутствующих изображений.   -  person Álvaro González    schedule 27.03.2013
comment
См. заголовок stackoverflow.com/questions/3984287/   -  person AmGates    schedule 27.03.2013


Ответы (3)


Есть специальное событие, позволяющее это сделать. Его :

<img src="" onerror="this.src='path/to/default'" />
person JoDev    schedule 27.03.2013
comment
‹img src= onerror=this.src=path of img›' можно ли это использовать.. если да, то как использовать его во внутреннем html ?? - person Raghu; 28.03.2013

Вы можете проверить, загружено ли изображение в JavaScript:

var img = document.getElementById('image');
if ( img.complete && img.naturalWidth == 0 ) {
  // some error, load alternate image:
  img.src = "path to alternative img";
}

Изменить: Полное решение (с использованием onerror из ответа @JoDev) будет таким:

<script>
function validate (img) {
  // Clear the callback to avoid infinite loop in case
  // new image path would be also invalid.
  img.onerror = null;

  if ( img.complete && img.naturalWidth == 0 ) {
    // some error, load alternate image:
    img.src = "http://example.com/valid_path.png";
  }
}
</script>

<img onerror="javascript:validate(this);" 
     src="http://example.com/some_invalid_path.png"/>
person kamituel    schedule 27.03.2013

Пожалуйста, обратитесь к коду ниже..

Внутри функции onerror добавьте путь src, который вы хотите загрузить. Если src загружается, изображение загружается.

<img onerror="this.onerror=null;this.src='http://www.personal.psu.edu/oeo5025/jpg.jpg'" id="ddd" 
src='http://www.loveimagesdownload.com/wp-content/uploads/2016/08/declaration-of-love_23-2147517078.jpg'/>
person anand vishwakarma    schedule 28.03.2018