Muchas personas hemos visto la forma en que Gmail permite subir archivos, ya que si seleccionas un archivo Gmail automaticamente agrega otro campo para subir otro archivo, esto es muy práctico si se quiere hacer uploads de archivos multiple.

Veamos el script para realizar esta acción. Lo primero es crear el formulario con un campo de tipo file llamado attach y un Div oculto para el enlace a Agregar otro Archivo.

< View plain text >
HTML

  1. <input type="file" name="attach" id="attach" onchange="setBlock();" />
  2.       <div id="moreUploads"></div>
  3.       <div id="moreLink" style="display:none;">
  4.       <a href="javascript:addFileInput();">Agregar otro Archivo</a>
  5.       </div>

El siguiente paso es crear las funciones javascript, la primera addFileInput crear el nuevo campo tipo file para seleccionar el siguiente archivo y setBlock para mostrar el enlace.

< View plain text >
js

  1. var upload_number = 2;
  2.       function addFileInput() {
  3.           var d = document.createElement("div");
  4.           var file = document.createElement("input");
  5.           file.setAttribute("type", "file");
  6.           file.setAttribute("name", "attach"+upload_number);
  7.           d.appendChild(file);
  8.           document.getElementById("moreUploads").appendChild(d);
  9.           upload_number++;
  10.       }
  11.  
  12.       function setBlock() {
  13.          document.getElementById('moreLink').style.display = 'block';
  14.       }