Событие загрузки изображения не запускается на iPhone (IOS)

Question

У меня есть очень простой фрагмент кода для установки фонового изображения элемента после загрузки изображения на новый объект изображения.

var img = new Image(); 
var myelement = document.getElementById('myelement_id'); 
img.addEventListener('load', function(){ 
    myelement.setAttribute('style', 'background-image: url(/public/images/myimage.jpg)'); 
}); 
img.src = '/public/images/myelement.jpg'; 

Этот вопрос уже задан несколько раз, но ответы не были удовлетворительными.

Это не размер изображения. Событие загрузки не запускается независимо от размера или формата изображения.

Событие ошибки не запускается ни одним из них. Некоторые люди предположили, что событие ошибки будет запущено вместо события загрузки в IOS.

Это не браузер. Это IOS. Поведение в Safari или Chrome на IOS одинаково.

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

Я назначаю функцию сначала, а затем устанавливаю src для запуска события загрузки.

Answer 1

Кажется, это работает для меня. Но я не уверен, изменилось ли добавление прослушивателя событий к событию .load.

function imgLoad(_imgDOM, _imgID){ 
    _imgDOM.setAttribute('style', 'background-image: url(/public/images/load/' + _imgID + '.jpg)'); 
} 

var imgLoadArray = document.querySelectorAll('.img__load'); 

for (var i = 0; i < imgLoadArray.length; i++) { 
    var imgDOM = imgLoadArray[i]; 
    var imgID = imgDOM.getAttribute('id'); 
    var img = new Image(); 
    img.onload = imgLoad(imgDOM, imgID); 
    img.src = '/public/images/load/' + imgID + '.jpg'; 
}