Javascript Girl
  1. Javascript Girl
  3. Chargez l'image si elle est trouvée, mais chargez une autre image
Intereting Posts
Quelles sont les meilleures pratiques pour créer des listes de scores élevés en ligne dans les jeux basés sur JavaScript? Déplacez-vous vers l'arrière en parcourant la même page avec une chaîne de requête différente Différence entre JSON.stringify et JSON.parse Document.write – remplacez les balises "</ script>" par "<\ / script>" Les guidons ne remplissent pas le tableau HTML5 File API modifier fichier.nom Comment utiliser socketio pour afficher l'utilisateur en ligne / hors ligne en temps réel à l'aide de Sails? Combinaison PHP & <noscript> pour détecter JavaScript activé dans le navigateur Correspondre une sous-chaîne avec une chaîne Tumblr: Comment contrôler CSS avec post tagging (UPDATE: Méthode de travail sans JQuery!) Comment trouver l'emplacement de géoip pour tous les utilisateurs de Nodejs Android Web-View: Injectez le fichier Javascript local vers la page Web à distance Retournez l'élément du tableau par index dans un modèle de barres spatiales météorologiques La vidéo HTML5 ne fonctionne pas avec Android Positionnement manuel des tiques sur l'axe – D3

Chargez l'image si elle est trouvée, mais chargez une autre image

Ce que je dois faire est simple à dire mais (pour moi) difficile à faire:

En utilisant javascript , donné un nom d'image, c'est-à-dire "image01.jpg", je dois vérifier si cette image existe dans un certain dossier ou chemin (local ou sur le Web). Si l'image n'existe pas dans ce dossier, je dois vérifier si la même image existe dans un autre dossier.

Par exemple, avec un pseudo code 

imageToFind = 'image01.jpg' path1 = 'users/john/images' path2 = 'users/mike/img' if path1+'/'+imageToFind exists //do something else if path2+'/'+imageToFind exists //do something else print('NOT FOUND')

Quel type d'approche proposez-vous? J'ai essayé d'y parvenir en utilisant d'abord ajax, puis en utilisant l'image de javascript (), mais j'ai échoué dans ces deux cas.

Merci d'avance pour toute aide, salutations distinguées

Vous pouvez compter sur les gestionnaires d'événements native onload et onerror qui déclenchent les noeuds Image . Donc, ça pourrait ressembler à 

 var images = ['users/john/images/image01.jpg','users/mike/img/image01.jpg','some/more/path/image01.jpg']; (function _load( img ) { var loadImage = new Image(); loadImage.onerror = function() { // image could not get loaded, try next one in list _load( images.shift() ); }; loadImage.onload = function() { // this image was loaded successfully, do something with it }; loadImage.src = img; }( images.shift() ));

Ce code est probablement un peu plus important que vous ne l'avez demandé. Vous pouvez essentiellement, mais autant de chemins d'image que vous souhaitez dans ce tableau, le script recherchera la liste jusqu'à ce qu'il puisse charger une image avec succès.

Utilisez le rappel de Onerror: 

 var img = new Image(); img.onerror = function(){ img = new Image(); // clean the error (depends on the browser) img.onerror = function(){ console.log('not found at all !'); }; img.src = path2+'/'+imageToFind; }; img.src = path1+'/'+imageToFind;

Essayer quelque chose comme 

 objImg = new Image(); objImg.src = 'photo.gif'; if(!objImg.complete) { img.src = path2+'/'+imageToFind; //load other image }else{ img.src = path1+'/'+imageToFind; }

Je pense que vous devez vous demander: pourquoi je ne sais pas si les images existent?

J'ai l'impression de ne pas avoir ce problème, ou je veux le résoudre de cette façon.