Forzar click a un campo File con JavaScript

Vamos a ver como podemos abrir un diálogo de selección de archivo forzando el click a un campo archivo de un formulario , para ello utilizaremos la función click() .

<input type="file" onmouseover="this.click()">

Este ejemplo, nos abrirá el dialogo de archivo al pasar el mouse por encima del campo de archivo.

Observaremos que el método click() funciona únicamente en un campo archivo si utilizamos Internet Explorer, por lo que si queremos substituir un campo archivo por un botón o algo parecido, antes de hacerlo deberemos comprovar que el visitante utilice Internet Explorer:

<input type="file" id="archivo1" name="archivo1">
<script language="JavaScript">
if (navigator.appVersion.indexOf('MSIE') > -1) {
   archivo1.style.visibility = 'hidden';
   archivo1.style.position = 'absolute';
   document.write('<input type="button" value="Examinar..." onclick="archivo1.click();">');
}
</script>

Este ejemplo, que podéis probar , sustituirá el campo archivo por un botón a los usuarios que utilizen IE pero mantendrá el campo file para los que no lo usen.

Al pulsar el botón 'Examinar...' se abrirá el dialgo de selección de archivo y se guardará el archivo seleccionado en el campo de nombre archivo1.

Artículo por cortesía de Eloi de San Martín
www.programacionweb.net

Usuarios que han visto este tema también han visto...

- Como hacer un Ticker
- Un script en Javascript que detecta el navegador del visitante
- Bifurcaciones condicionales en JavaScript
- Rollover con javascript
- Confirmar acción con JavaScript

- Versión imprimible de este documento

- Enviar por e-mail este documento