¿Cómo mostrar automáticamente los input type según selecciono el archivo?

[Etherman]

buenas, quería preguntar si alguien tiene algún código para mostrar automáticamente los input type según selecciono el archivo
actualmente lo tengo así (se ve bastante feo):

01<input type="file" name="foto1" ><br>
02<input type="file" name="foto2" ><br>
03<input type="file" name="foto3"><br>
04<input type="file" name="foto4"><br>
05<input type="file" name="foto5"><br>
06<input type="file" name="foto6"><br>
07<input type="file" name="foto7"><br>
08<input type="file" name="foto8"><br>
09<input type="file" name="foto9"><br>
10<input type="file" name="foto10"><br>

y envia a php.

porfavor no me respondáis como si fuera experto, ya que no lo soy. Os lo agradezco.
saludos

[Etherman]

Encontre esto:
<div class="pre-spoiler">
<span style="float: left; padding-top: 2px;"></span><input id="xs" value="Ver más" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick="if(this.parentNode.getElementsByTagName(' div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar';}else{this.parentNode.getElementsByTagNa me('div')[0].style.display = 'none'; this.value = 'Ver más';}" type="button" /><div class="spoiler" style="display: none;">
COLOCAMOS AQUI LA PARTE A OCULTAR </div>
</div>
Pero no es automático

[ocp001a]

Si te refieres a que quiere mostrar sólo un campo de tipo archivo y que conforme vayan eligiendo archivo para subir muestre un campo más, tienes dos opciones:
1 Colocas sólo un campo tipo archivo en el formulario. Cuando seleccionen el archivo agregas un nuevo campo. Esto lo harías mediante javascript, busca info sobre createelement y appendChild
2. Colocas todos los campos tipo archivo pero los mantienes ocultos (atributo display:none) y conforme vayan eligiendo archivos los muestras.

[stramin]

Iniciado por ocp001a

Si te refieres a que quiere mostrar sólo un campo de tipo archivo y que conforme vayan eligiendo archivo para subir muestre un campo más, tienes dos opciones:
1 Colocas sólo un campo tipo archivo en el formulario. Cuando seleccionen el archivo agregas un nuevo campo. Esto lo harías mediante javascript, busca info sobre createelement y appendChild
2. Colocas todos los campos tipo archivo pero los mantienes ocultos (atributo display:none) y conforme vayan eligiendo archivos los muestras.

Genial! yo no había entendido la pregunta, si debe ser eso, Etherman, pregunta en Javascript.

[Etherman]

Sí, exactamente, es la intención stramin. Muchas gracias ocp001a, no sé si serías tan amable de postear código de ejemplo me sería de gran ayuda.
saludos

[caricatos]

Hola:

Fíjate en el código de esta página: Caricaturas individuales a color en acuarelas

Saludos

[Etherman]

Gracias caricatos, por cierto, fabulosa página.
Aunque funcionaba bien, no supe sacar nada en claro de cómo funcionaba aquel código..
Bueno, como no me sirve la maña uso la fuerza, he usado un código para ocultar campos, y el código me queda así:

Código HTML:

<div class="pre-spoiler">
01 <input type="file"name="imgfile1"><span style="float: left; padding-top: 2px;"></span><input id="xs" value="Poner otra" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Poner otra';}" type="button" /><div class="spoiler" style="display: none;">
<div class="pre-spoiler">
02 <input type="file"name="imgfile2"><span style="float: left; padding-top: 2px;"></span><input id="xs" value="Poner otra" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Poner otra';}" type="button" /><div class="spoiler" style="display: none;">
<div class="pre-spoiler">
03 <input type="file"name="imgfile3"><span style="float: left; padding-top: 2px;"></span><input id="xs" value="Poner otra" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Poner otra';}" type="button" /><div class="spoiler" style="display: none;">
<div class="pre-spoiler">
 04 <input type="file"name="imgfile4"><span style="float: left; padding-top: 2px;"></span><input id="xs" value="Poner otra" style="margin-left: 50px; padding: 0px; width: 80px; font-size: 14px; font-family: trebuchet ms;" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Ocultar';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Poner otra';}" type="button" /><div class="spoiler" style="display: none;">
<div class="pre-spoiler">
05 <input type="file"name="imgfile5"></div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div></div>
 

[caricatos]

Hola:

Mi página básicamente tiene un input oculto y deshabilitado, y por cada nuevo file, se clona ese campo oculto y se añade al formulario, lo demás también es cuestión de mostrar y ocultar.

Saludos