Afficher une image en HTML

Résolu/Fermé

hdiama Messages postés 188 Date d'inscription vendredi 24 octobre 2008 Statut Membre Dernière intervention 2 janvier 2012 - 13 juin 2011 à 21:43
joomliner Messages postés 89 Date d'inscription jeudi 9 juin 2011 Statut Membre Dernière intervention 1 août 2016 - 15 juin 2011 à 18:48

Bonjour,

Je soumets un formulaire à mes clients, dont un des champs conduit à l'ouverture d'une fenêtre "parcourir" qui demande d'entrer une image. Comment pourrais-je ensuite afficher cette image? dois-je utiliser le lien de l'image fourni par la fenêtre?

Merci d'avance!

A voir également:

Afficher image en html
Image iso - Guide
Editeur html - Télécharger - HTML
Acronis true image - Télécharger - Sauvegarde
Google recherche par image - Guide
Faststone image viewer - Télécharger - Visionnage & Diaporama

1 réponse

Réponse 1 / 1

joomliner Messages postés 89 Date d'inscription jeudi 9 juin 2011 Statut Membre Dernière intervention 1 août 2016 36
Modifié par joomliner le 20/08/2011 à 15:56

Voici une méthode en JavaScript fonctionnelle sous Internet Explorer et FireFox, je viens de la tester sous IE8 et FireFox 4.0.1.

<html>  
<head>  
<title>Exemple formulaire HTML avec INPUT fichier et affichage avec JavaScript</title>  
</head>  
<body>  
<img id="imageChoisie" width="200" height="200" alt="Image choisie">  
<form name="form1">  
<input type="file" id="inpChoixImage" name="inpChoixImage">Choisir un fichier</input>  
<input type="hidden" id="hidChoixImage" name="inpChoixImage">Choisir un fichier</input>  
</form>  
<script type="text/javascript" language="javascript">  
   
document.getElementById('inpChoixImage').onchange = function() {  
 var filename = document.getElementById('inpChoixImage').value;  
 var Img = new Image();  
    
 if (navigator.appName == 'Netscape') {  
  document.getElementById('imageChoisie').src = inpChoixImage.files.item(0).getAsDataURL();  
 }  
 else {  
  Img.src = filename;  
  document.getElementById('imageChoisie').src = Img.src;   
 }  
}  
</script>  
</body>  
</html>

Source : http://joomliner.ashbytech.com/web-tips/javascript/19-javascript-read-input-file-value-and-use-it.html

JoomLiner is an affordable ride to get you on track of the World wide web

skymax406 Messages postés 215 Date d'inscription samedi 19 juillet 2008 Statut Membre Dernière intervention 22 avril 2015 24
15 juin 2011 à 10:41

Question : J'ai vu ton code , ce que tu fait c'est lire l'image et l'afficher c'est tout nan ? On ne peut donc pas l'enregistrer ?

Sinon c'est en php il me semble ?

hdiama Messages postés 188 Date d'inscription vendredi 24 octobre 2008 Statut Membre Dernière intervention 2 janvier 2012 6
15 juin 2011 à 17:44

Merci beaucoup joomliner, c'est sur ce je bloquais :)

joomliner Messages postés 89 Date d'inscription jeudi 9 juin 2011 Statut Membre Dernière intervention 1 août 2016 36
Modifié par joomliner le 15/06/2011 à 20:00

@skymax406 : Exact, on ne peut pas l'enregistrer, l'avenue PHP pourra faire l'affaire à ce niveau là.

Discussions similaires

Retrouver l'image originale après avoir fait des modifications ?

programme qui n'affiche pas le mot secret

Image cliquable dans html

=Si la cellule A1 a du texte = B1 devient couleur

Espace en HTML

Discussions similaires

Newsletters