les explico un poco como funciona lo obtuve buscandolo en google
tengo mi input file que tiene el id="galeria1", y un div que tiene como id="lista_galeria1", bueno pues facil con el input selecciono una o varias imagenes ya que tiene el atributo multiple, y en el div lista_galeria1 me muestra las imagenes que seleccione esto por fines practicos en un formulario que estoy haciendo.
resulta que en mi formulario tengo unos 8 input file y bueno para poder separar genere un script para cada uno de ellos la cuestion aqui y espero me puedan ayudar es que solo funciona si los input file llevan por name="files[]" si le cambio la variable tanto en el name="galeria1[]" y me voy al script y reemplazo la palabra files por galeria 1 no funciona, como mencionaba solo funciona si lleva por name files[] esto pues me complica ya que al subir al servidor las imagenes pues si las sube pero me gustaria poder separar o diferenciar cada input file para asi saber que imagenes vienen de cada uno. espero no confundirlos
saluds
Código HTML:
<input type="file" id="galeria1" name="files[]" multiple /> <div id="lista_galeria1"></div> <script> function VisualizarGaleria1(evt) { var files = evt.target.files; // FileList object document.getElementById("lista_galeria1").innerHTML=""; // Obtenemos la imagen del campo "file". for (var i = 0, f; f = files[i]; i++) { //Solo admitimos imágenes. if (!f.type.match('image.*')) { continue; } var reader = new FileReader(); reader.onload = (function(theFile) { return function(e) { // Insertamos la imagen var respaldo1=document.getElementById("lista_galeria1").innerHTML; document.getElementById("lista_galeria1").innerHTML =respaldo1+['<img class="galeria" src="', e.target.result,'" />'].join(''); }; })(f); reader.readAsDataURL(f); } } document.getElementById('galeria1').addEventListener('change', VisualizarGaleria1, true); </script>