Función de carga asíncrona de archivo HTML5

La función de carga del archivo de desarrollo nunca ha sido algo agradable, y es aún más para la carga de cargas asíncronas. Este artículo utiliza brevemente el FormData de HTML5 para implementar la carga asíncrona de archivos, y también puede lograr barras de entrada de carga y verificación del tamaño del archivo. El servidor utiliza el esquema SpringMVC para el procesamiento.

 <Form ID = MyForm> <Input type = File id = u_photo name = u_photo/> <input type = button id = subt-btn value = upload/> </form>

 $ (#Enviar-btn) .on ('click', function () {$ .AJAX ({url:/test/upload, type: post, data: nuevo formdata ($ (#myform) .get (0))) , // es muy importante.

El control del tamaño del archivo y el comportamiento correspondiente deben procesarse por sí mismo según sea necesario.

 $ ('#u_photo'). }}});

Agregue XHR al método AJAX para controlar el progreso de carga. Mostrar y ocultar la barra de progreso debe procesarse por sí mismo.

 Xhr: function () {var myxhr = $ .AJAXSETTINGS.XHR (); .attr ({valor: e.loaded, max: e.total,});}}, falso);} return myxhr;}

 <Spendency> <MoupRoMID> Commons-IO </groupid> <artifactid> commons-io </arfactid> <versever> </verversion> </pendency> <MoupRoD> commons- fileUpload </groupId> <ArtifactId> Commons-FileUpload </artifactid> <versión> 1.3.2 </versión> </pendency>

 <bean id = multipertesolver class = org.springframework.web.multipart.commonsMonsMultipresolver />

El programa de ejemplo no proporciona el código correspondiente para la verificación, almacenamiento y procesamiento de archivos.

 @RequestMapping (valor =/test/upload, método = requestmethod.post) @ResponseBodyPublic String upload (@RequestParam (u_photo) multipartfile _photo) {system.out.println (u_photo =+u_photo.getSize ());

IE 10+, Firefox 4.0+, Chrome 7+, Safari 5+, Opera 12+

Si no está satisfecho con el plan anterior, se recomienda utilizar las siguientes soluciones:

Cargador de archivos jQuery

Lo anterior es la función de carga asíncrona del archivo de implementación HTML5 introducido por Xiaobian. ¡Muchas gracias por su apoyo al sitio web de VEVB Wulin!