anteprima immagine <input type="file">

loreberti10

Utente Attivo
22 Set 2012
43
0
0
Ciao a tutti, ho guardato un po nel forum ma non ho trovato la risposta al problema che ho e soprattutto, se c'è una risposta...:/
Comunque, io ho creato in php un form per un inserimento di immagini tramite l'input file:
Codice:
$i=0;
	for($i; $i<10; $i++){
		echo "<input type='file' name='foto$i' class='caricaimm'/>
                        <img src='' class='img'/>
                        <input type='radio' name='principale' value='$i'/>";
	}
Ora tralasciate il secondo input che non c'entra, io in pratica quello che vorrei fare, se è possibile, sarebbe questo:
Un utente clicca sull'input file e gli si apre la finestrella dello "sfoglia" sceglie l'immagine..Appena scelta l'immagine, è possibile creare una anteprima in jquery?
Mi era venuto in mente di poter prendere il percorso dell'immagine per creare una anteprima e inserielo nel tag sotto <img src=''..>...però non ho capito come fare, c'è una soluzione?
Grazie in anticipo a tutti.
 

criric

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
21 Ago 2010
5.607
54
48
TN
Ciao,
dai un occhiata a questo codice
al tempo l'avevo testato e funziona ma non sono stato in grado di rispondere all'utente (al massimo puoi farlo tu)
 

loreberti10

Utente Attivo
22 Set 2012
43
0
0
Grazie, ho risolto in questa maniera: (lo posto cosi che serva a qualcun altro):
codice php/html
Codice:
<? 
	$i=0;
	for($i; $i<10; $i++){
		?><input type='file' name='foto<?php echo $i; ?>' class='caricaimm' OnChange='show(this, <?php echo $i;?> )'/>
   <img src='' width='200' height='150' class='foto<?echo $i;?>' id="<?echo $i;?>"/><?
	}
 ?>

Funzione jquery show():
Codice:
function show(ele, i){
			
			$('img#'+i).attr('src', ele.value);// for IE
            if (ele.files && ele.files[0]) {
			
                var reader = new FileReader();
				
                reader.onload = function (e) {
                    $('img#'+i).attr('src', e.target.result);
                
				}

                reader.readAsDataURL(ele.files[0]);
            }
	}

Per quanto riguarda quello che mi hai indicato ho letto, ma io non ho capito cosa vorrebbe fare.. :eek:
 
Discussioni simili
Autore Titolo Forum Risposte Data
silvia88 ***Help*** - Anteprima immagine photoshop diversa da file Photoshop 3
H Anteprima immagine video youtube HTML e CSS 1
S Condividere correttamente link su Facebook (immagine anteprima errata) HTML e CSS 1
K onmouseover anteprima immagine come in google Javascript 2
A galleria jquery: problema nel caricamento di una immagine da un'anteprima HTML e CSS 10
P Immagine nell'anteprima del sito HTML e CSS 7
M Link Con Immagine Anteprima Javascript 3
N Non Autorizzato. Dovresti rimuovere il parametro customize_messenger_channel per visualizzare l'anteprima in frontend. WordPress 1
Alex_70 Visualizzare anteprima foto in dropdown PHP 2
trattorino [Javascript] Spoiler con anteprima Javascript 3
K [Joomla] Visualizzazione anteprima diversa dalla demo del template Joomla 0
Mer556 [Javascript] IMMAGINI A SCORRIMENTO, ANTEPRIMA 3 Javascript 1
momeraths [HTML] Anteprima sito versione mobile HTML e CSS 2
L php/mysql - anteprima notizia con pulsante PHP 2
B Anteprima Facebook HTML e CSS 4
F Anteprima descrizione WordPress 1
J Problema per creare anteprima dei post da un db PHP 2
F [RISOLTO] Creazione slider con anteprima con jquery jQuery 8
M Dreamweaver non visualizza file swf nell'anteprima browser Webdesign e Grafica 0
L jquery slideshow con anteprima jQuery 10
una mamma snob Modificare impostazioni di visualizzazione dell'anteprima articoli con immagini. WordPress 5
S stampare senza anteprima Javascript 0
I dissolvenza ed immagini anteprima in slide gallery Javascript 2
Y anteprima codice HTML in windows 7 Windows e Software 0
L script anteprima testo e link "leggi tutto" PHP 0
L Anteprima foto da menu a tendina PHP 10
T Slider immagini con anteprima Javascript 1
D Anteprima multischermo dreamweaver cs5 HTML e CSS 0
U Creare anteprima da un video? PHP 1
I Anteprima Sito PHP 2
F Anteprima guida Visual Studio 2010 su mrwebmaster Supporto Mr.Webmaster 0
M anteprima con Microsoft Expression Web HTML e CSS 3
C Anteprima sito diversa da quando on-line HTML e CSS 2
F Wordpress: anteprima con foto WordPress 4
A gif animata con photoshop senza anteprima Photoshop 1
R passare valori da una form per un'anteprima Javascript 0
borgo italia auguri (in anteprima) Discussioni Varie 5
M Formattare testo senza anteprima Javascript 2
G Come ridurre l'anteprima cella Excel? Windows e Software 0
C Problema anteprima Flash 1
K finestrina x visualizzazione anteprima Javascript 0
N webcast per vedere in anteprima WindowsVista Windows e Software 0
S Editor freeware (anche php con possibilità anteprima) HTML e CSS 2
A FP2003: non funzionano i link nell'anteprima HTML e CSS 17
milly non si vedono in anteprima i pulsanti creati con front page HTML e CSS 15
peppoweb Windows Longhorn in anteprima? Windows e Software 0
M Upload immagine con javascript problemi con FormData() Javascript 1
M Visulizzare immagine con php PHP 8
Stex1967 Salvare una immagine che si trova su porta TCP 8080 di altro sito PHP 6
L Come caricare un'immagine in Canvas dinamicamente Javascript 0

Discussioni simili