javascript, image onload() не запускается в webkit при загрузке того же изображения
у меня есть <img>
элемент и я меняю его . Элемент имеет onload
функция обработчик прилагается. Каждый раз, когда я изменяю атрибут src и загружаю изображение, функция обработчика должна запускаться.
в Chrome и Safari, Если я назначаю тот же src, что и раньше, функция обработчика не запускается. Перед назначением того же src, что и раньше, я пробовал imgElement.src=''
, imgElement.src= null
, imgElement.src='notExistingFile.jpg'
и ничего из этого не работает.
пожалуйста, помогите. У кого-нибудь была эта проблема раньше?
редактировать: это сработало, выполнив imgElement.src = " перед назначением того же src, что и раньше:
imgElement.src = '';
imgElement.src = 'image.jpg';
3 ответов
Это известная ошибка. Вот обходной путь от этой ссылки:
это не ошибка. WebKit - это просто больше строгий. Необходимо создать новый экземпляр
Image()
объект перед заменой, вот так:var photo = document.getElementById('image_id'); var img = new Image(); img.addEventListener('load', myFunction, false); img.src = 'http://newimgsource.jpg'; photo.src = img.src;
Я думаю, что ваша проблема здесь в том, что вы назначаете событие onload после изменения значения src, поэтому, как только изображение уже было загружено в кэш, загрузка браузера происходит до назначения события. Означает, что вместо этого:
myImageObject.src = "something.png";
myImageObject.onload = myCallback;
этого:
myImageObject.onload = myCallback;
myImageObject.src = "something.png";
чтобы добавить к ответу Мэтта Болла, рассмотрим img.onload вместо img.addEventListener ().
var photo = document.getElementById('image_id');
var img = new Image();
img.onload = myFunction;
img.src = 'http://newimgsource.jpg';
photo.src = img.src;
img.onload легче читать и лучше работает между агентами пользователей.