Categories
html image internet-explorer javascript

Endless looping when src value is changed in Internet Explorer

I have a problem with some javascript in Internet Explorer.

It works fine in other browsers.

I have the following method, that changes the src property of an images and when this happens a download of that image should start. See below:

for (var i = 0; i < imagesStartedDownloading.length; i++) {
if (imagesStartedDownloading[i] == false && responseItems[i] == true) {
console.log("image", i);
var url = baseurl + "/ImageDownload/?imageName=" + hash + "_" + imageDegrees[i] + ".jpg" + "&r=" + Math.random();
imagesStartedDownloading[i] = true;
images.eq(i).attr("src", url);
}
}

The problem is that in when changing this property Internet Explorer starts an endless loop of downloading images. Notice that i have put a console.log in the for-loop. I can confirm that this for-loop does not run in an endles loop. It is only run once for each image that should be downloaded. So that is not the problem.

The behaviour can actually be seen on this page: http://www.energy-frames.dk/Konfigurator. Hit F12 and check in the network tab. Make a change to image on the homepage so a download of new images is started, e.g. Bredde(Width in english), see below:

enter image description here
When this change is made new images are downloaded in an endless loop(it happens almost every time in IE). See below of what you could change

I have really spent a lot of time debugging in this and i cant see why it behaves like this in IE but not in all other browsers.

So does anyone have any idea why this happens? Or have some suggestions on what i could try?
EDIT:

@gxoptg
I have tried what you suggested. using “https://www.faqcode4u.com/faq/412165/javascript:void 0” like this:

var newimg = $("<img class="rotator" + (isMainImage ? " active" : "") + "" src="https://www.faqcode4u.com/faq/412165/javascript:void 0" />");

and this:

img.attr("src", "https://www.faqcode4u.com/faq/412165/javascript:void 0");

gives me this error:

enter image description here

On the other hand, if i completely remove the line img.attr(“src”, “”);
in the imgLoadError method, then i see that images are not downloaded in an endless loop. On the other hand they are not displayed. So am i using the javascript:void 0 wrong?

When i do the following:

img.attr("src", "void(0)");

Then the there is not endless loop but the image wont appear in IE – still works fine in chrome.