Prévisualisation d'une image sélectionnée sur disque dur

**ero-sennin** · 01/08/2008, 11h38

Bonjour,

Tout d'abord, je tiens à dire que je suis très novice en ce qui concerne le javascript

J'essaie depuis ce matin de faire une prévisualisation d'image avant Upload.
Pour ce faire, j'ai parcouru le forum, et éplucher divers site mais je n'arrive pas à cerner mon soucis.

Voici le code en son entier :

Code xhtml :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  <head>
  <title>Test</title>
 
  <script type='text/javascript'>
  function VoirImage() 
  {
    var imgSrc=document.getElementById('imagePortrait').value;
        document.getElementById('imagePortrait').src="file:///"+imgSrc;
  }
  </script>
  </head>
 
  <body>
    <table>
      <tr>
        <td><img id="imagePortrait" src="/photos/portrait_non_disponible.png" /></td>
        <td>
        <fieldset>
          <legend>Ajouter une image (facultatif)</legend>
          <!-- champs d'envoi de fichier, de type file -->
          <p><label for='photo'>Photo :</label><input id="photo" type="file" name="photo" onchange="VoirImage()"/></p>
        </fieldset>
        </td>
      </tr>
    </table>
  </body>
</html>

Donc le but, c'est qu'une fois que l'utilisateur à choisi une image, on la prévisualise sans pour autant l'uploader... Si le champ input file est vide, alors on laisse l'image par défaut que j'ai renseigné dans la balise.

Quelqu'un peut-il m'expliquer mon erreur car j'avoue que là, j'ai un peu de mal à cerner le souci.

Merci par avance
Ero-Sennin

**Matthieu2000** · 01/08/2008, 12h19

var imgSrc=document.getElementById("photo").value;

erreur d'id?

**ero-sennin** · 01/08/2008, 12h31

Alors la, je dis grand merci!
C'est bon, je récupère bien l'image

Il ne me reste plus qu'à redéfinir l'image.

Petite question ...
Sur Firefox, on ne peut faire ce genre de chose (c'est une sécurité d'après ce que j'ai lu). On ne peut pas faire autre chose, contourner ?

Merci