2010-07-10 19 views
6

Estoy buscando crear un botón que al hacer clic abra una ventana de diálogo donde seleccionan una imagen para cargar y luego una vez que la seleccionan y presiona Aceptar dentro del cuadro de diálogo comienza la carga (barra de carga opcional :))Botón de carga con un clic

Preferiblemente sería un plugin jquery que modifique la funcionalidad de la entrada del archivo html estándar ... ya que he escrito el código usando uno.

+0

estoy realmente sólo mirando para subir un archivo así que preferiría el enfoque más simple posible. Hasta ahora todos han sido un poco exagerados para mis necesidades. Gracias :) – Pablo

+0

Te escucho, pero me temo que no hay una manera más simple que usar un cargador personalizado. El botón de carga de archivos del navegador no se puede activar mediante programación por razones de seguridad. –

+0

¿Se puede enviar el formulario en el cuadro de diálogo de selección de archivos que se cierra? – Pablo

Respuesta

3

El complemento JQuery uploadify se cargará con una barra de progreso e incluye la funcionalidad para la carga de archivos únicos o múltiples.

3

SWFUpload es capaz de hacer eso. Es un componente de carga basado en Flash con el que puede interactuar utilizando JavaScript.

Demo

2

Existen otras soluciones basadas en flash que no sea SWFupload. Eche un vistazo a uploadify.com

Este es un plugin de jquery.

0

Esto podría ser lo que estás buscando:

https://github.com/bencolon/file-uploader

El script soporta carga de varios archivos, pero es una opción. Mientras que Uploadify y SWFUpload requieren que se instale Flash, este complemento está libre de Flash. Probablemente sea el enfoque más simple para su problema. Hay plugins más pequeños disponibles, pero tienden a no funcionar bien en todos los navegadores.

2

hay algo de trampa para hacer esto usando jquery y html ordinario. esto es lo que uso en mi proyecto para cargar un archivo (limitado a uno) y simplemente usar un botón y ningún complemento, aunque su botón necesita un estilo.

código HTML

<form method="get" action="somephp.php"> 
       <input type="file" id="upload" name="upload" style="width: 88px; opacity:0.0; filter:alpha(opacity=0); " onchange='uploadChange()'/> 
       <input type="submit" name="submit" style="margin-left: -88px"/> 
      </form> 

jQuery:

<script> 
    function uploadChange(){ 
     $('input[type="submit"]').click(); 
    } 
</script> 
Cuestiones relacionadas