Solution to the invalid image onload event in IE browser_javascript skills

The story mode implementation is to only load the currently browsed photo and the two photos below it. The comment area will be loaded and rendered when the photo is loaded. Before the picture is loaded, a one-pixel picture will be used as a placeholder, and a The loading class will display a loading background image and replace it with a real picture when it is judged to be in the visual area. After the picture is loaded successfully, the loading class will be deleted.

The problem lies at the end. During the test, it was found that the loading class cannot be deleted under IE. The code at that time was as follows:

Copy the code The code is as follows:

img.src = _src;
img.src = _src;
img.onload = function(){
_con.delClass('loading') ;
}

I searched online and found that the order of onload and the statements defining src should be changed. IE fetches images from the cache and onload is not triggered at all. Opera also has this problem. The correct code modification is as follows

Copy code The code is as follows:

img.onload = function(){
_con. delClass('loading');
};
img.src = _src;

It will be normal immediately

Conclusion: Onload should be written in front of src, first tell the browser what to do after the image is loaded, and then let it load the image. Therefore, it is not that the IE browser does not trigger the onload event, but because the loading buffer speed is too fast. It has already finished loading without telling it what to do after loading. On the other hand, Firefox is obviously smarter. After adding the onload event, the Firefox browser will detect whether the buffer already has this image, and if so, it will trigger this event directly!