Vérifier si une image est valide

Version imprimable

05/12/2017, 16h55
BruceBoc

Vérifier si une image est valide
Bonjour,
J'aimerai savoir comment vérifier si une image est correctement chargée. En effet j'ai cette portion de code :
Code:

1 2 3 4 if (localStorage.getItem('wallpaper')) { document.body.style.backgroundImage = localStorage.getItem('wallpaper'); }
Dans certains cas, localStorage.getItem('wallpaper') renvoi vers un fichier inexistant et le font d'écran ne s'affiche pas. Je voudrais, ce cas de figure, détecter cette erreur et afficher une image par défaut.

Merci d'avance
05/12/2017, 19h16
NoSmoking

Bonjour,
charge l'image dans un conteneur non visible et place un écouteur onerror sur ton image.

Merci beaucoup, cela fonctionne parfaitement. :merci:

J'ai donc ajouté cela coté html :

Code:

<img id="backgroundTest" onerror="loadDefautBackground()" hidden/>

Et du coté javascript :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
function loadPrefs(){
	if (localStorage.getItem('wallpaper')){
		var str = localStorage.getItem('wallpaper');
		document.body.style.backgroundImage = localStorage.getItem('wallpaper');
		document.getElementById("backgroundTest").src = str.substr(5,str.length-7); //Pour un .src, il faut enlever le "url(...)"
	}
}
 
function loadDefautBackground(){
	console.log("erreur de chargement du fond d'ecran");
	document.body.style.backgroundImage = "url('medias/divers/defautBackground.jpg')";
 }