OnErrors в PHP/HTML

Question

Глупый вопрос да ... но есть ли способ, которым я мог бы использовать более двух норильщиков, имея небольшие проблемы с отображением изображений, так как я хочу использовать альтернативное изображение и местозаполнитель, если альтернативное изображение wasn ' т доступны

<script> 
function imgError(image) { 
image.onerror = ''; 
image.src = 'product_images/unavail.png'; 
return true; 
} 
</script> 



<!--<img src="<?php echo $pro_imagelink;?>" width="60" height="60" 
    onError='imgError(this);'/> 
    <img src="product_images/<?php echo $pro_image;?>" width="60" 
height="60" onerror="this.style.display='none'"/>--> 

    <img src="product_images/<?php echo $pro_image;?>" width="60" 
    height="60" onerror="this.src='<?php echo $pro_imagelink ?>'"/> 

думал сделать, если заявление для не-HTML прокомментировал строки, но на самом деле не знаю, как я мог бы сделать это так, он может показать заполнитель:/

Answer 1

Вам не нужен второй onError для обработки ситуации с заполнителем. Это то, что «альт» атрибут тега <img> для:

альт

Этот атрибут определяет альтернативный текст, описывающий изображение. Пользователи будут видеть, что этот текст отображается, если URL-адрес изображения неправильный, изображение не находится в одном из поддерживаемых форматов или если изображение еще не загружено.

Для получения более подробной информации см. https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img.

Итак, ваш первый «onError» может просто установить подходящий текст «alt». Затем, если «unavail.png» не загружается, пользователь увидит текст «alt». Вы все равно должны настраивать это, потому что он используется такими вещами, как расширители экрана, для улучшения доступности для пользователей с ослабленным зрением. Так что действительно это должен быть стандартный атрибут изображения, а не то, что вам нужно изменить, когда изображение не отображается. Он должен кратко описать, что пользователь видел, если бы изображение было доступно.

Однако документы также говорят:

Опуская этот атрибут в целом указывает на то, что изображение является ключевой частью содержания, и не текстуальное эквивалент не доступен.

Если изображение попадает в эту категорию, и «альтернативный» тег не было бы целесообразно, чтобы описать исходное изображение, то вы можете использовать функцию OnError установить альт тег для использования в качестве текста-заполнителя , в том, как вы изначально описали - например «Содержимое недоступно» или что-то еще.