Верх страницы
Обложка к записи jQuery сниппеты: обработка «битых» изображений
Время для прочтения: 0 мин. 0 сек.

jQuery сниппеты: обработка «битых» изображений

Проблему отсутствующих изображений или «битых» ссылок на них, когда вместо картинки вы видите крестик (как в IE), достаточно просто решить при помощи JavaScript. Если браузер по каким-то причинам не может найти изображение по ссылке, то возникает событие error, которое очень просто обработать.

Подготовьте в Adobe Photoshop (или любом графическом редакторе) заглушку для «битых» изображений и назначьте для всех картинок в документе обработчик события error. В моем примере я заменяю путь на несуществующую картинку заглушкой. Вы можете обработать данное событие по другому.


// Загрузить картинку об ошибке
$('img').error(function(){
    $(this).attr('src', 'broken-image.png');
});

// Или просто скрыть изображение
$("img").error(function(){
    $(this).hide();
});

Ссылки

Автор: Кобзарёв Михаил

Русский разработчик с 20-ти летним стажем. Работаю с PHP, ООП, JavaScript, Git, WordPress, Битрикс, Joomla, Drupal, OpenCart, DLE, Laravel, Moonshine, Symfony, SuiteCRM.

Оптимизирую сайты под Google Page Speed, настраиваю импорты для больших магазинов на WooCommerce + WP All Import. Пишу плагины на заказ. Все мои услуги.

Веду блог о разработке, дайджест в телеграмме и в ВК.

Вы всегда можете нанять меня.

Комментарии
Подписаться
Уведомить о
guest

2 комментариев
Межтекстовые Отзывы
Посмотреть все комментарии
vitalsone
vitalsone
11 лет назад

Решение не рабочее!

Предыдущая запись

Давайте дружить
в Telegram

Авторский блог вашего покорного слуги в Telegram про web, программирование, алгоритмы, инструменты разработчика, WordPress, Joomla, Opencart, Laravel, Moonshine, фильмы и сериалы