Discussion :

[johan_b]

Bonjour à tous,
tout est dans le sujet: j'ai un formulaire (nommé form1) qui contient un champ d'upload de fichier (image) (type="file"), et je voudrais avoir un apperçu avant d'envoyer le formulaire.
J'ai des problêmes de compatibilité (marche sous IE mais pas firefox)

voici mon code:
la fonction javascript:

Code :

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

1
2
3
4
5
6
7
 
function previewImg(){
var str = new String(document.form1.photo.value);
str=str.replace(/\s/g,"%20"); //supprimer les espaces
str=str.replace(/\\/g,"/"); //remplacer les antislash par des slash
        document.getElementById("prev").innerHTML='<img width=100 height=100 src="file:///'+str+'">';
}

le code HTMl de base:

Code :

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

1
2
3
4
<input type="file" name="photo" size="30" accept="image/*" onChange="javascript:previewImg()">
 
<div id="prev">
</div>

Pourtant je n'obtiens rien sous firefox (Sous IE, pas de problême, la photo s'affiche correctement). Pourtant, lorsque je copie le nom de l'image dans la barre d'adresse ça fonctionne très bien, mais il n'arrive pas a l'afficher dynamiquement dans la page.
J'ai essayé de voir d'ou venait le problême (gros merci au passage du web developpement toolbar de firefox)
exemple, avec une image C:/temp/Image2.jpg:
si j'affiche les informations sur les images, il me dit:

src:file:///C:/temp/Image2.jpg
filesize:45kb

mais ne l'affiche pas (icone "lien brisé/image inexistante")
Si je fais un "view generated sources" firefox me donne:

Code :

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

1
2
3
<div id="prev">
<img src="file:///C:/temp/Image2.jpg" height="100" width="100">
</div>

Et toujours pas d'image (alors que si je copie ladresse à la main dans la barre d'adresse ça marche nikel)


Je commence donc a tourner en rond, et j'ai plus vraiment les idées claires. Si quelqu'un pourrait m'éclairer un peu s'il vous plait,
merci encore

[Invité]

Il faut se méfier sous Firefox pour faire ça. Il ne veut pas normalement car c'est définit comme dans dans ses paramètres de sécurité.

Tu tape l'adresse : about:config
Ensuite tu cherche la ligne security.checkloaduri et tu double clicque dessus pour que le booléen passe à false.

Si ça marche toujours pas, regarde là, c'est expliqué : explications .

[johan_b]

merci pour l'info je ne savais pas, mais ça ne fonctionne toujours pas

[giorgio_hds]

Essaie de mettre une balise iframe avec dans attribut src l'adresse de ton image, ça peut marcher...

[johan_b]

toujours rien qui s'affiche avec le source généré:

Code :

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

<div id="prev"><iframe src="file:///C:/temp/Image2.jpg"></iframe></div>

remarque ça ne marche pas non plus sous IE cette fois :p

jutilise la version 2.0.0.1 de firefox, y'aurait-il un autre option a part security.checkloaduri a modifier?