源码网商城,靠谱的源码在线交易网站 我的订单 购物车 帮助

源码网商城

jquery uploadify和apache Fileupload实现异步上传文件示例

  • 时间:2022-11-19 01:38 编辑: 来源: 阅读:
  • 扫一扫,手机访问
摘要:jquery uploadify和apache Fileupload实现异步上传文件示例
jQuery Uploadify + Apache Fileupload异步上传文件示例 1、可以限制上传文件大小和类型,理论上任何类型的文件都可以上传(自己根据api配置即可); 2、后台使用Apache commons-fileupload-1.3.1.jar作为上传工具包,本示例支持一次性多文件上传; 3、文件上传目录可以任意指定,请在web.xml中配置; Uploadify api 详见http://www.uploadify.com/documentation/ FileUploadServlet
[url=/js/uploadify/uploadify.css]<script src="/js/jquery-1.9.0.js"></script> <script src="/js/uploadify/jquery.uploadify.min.js"></script> <script type="text/javascript"> $(function() {  $('#fileupload').uploadify({      'method'   : 'post',      'buttonText' : 'flash上传文件',      'fileSizeLimit' : '1024KB',      'fileTypeExts' : '*.gif; *.jpg; *.png',   'swf'      : '/js/uploadify/uploadify.swf',   'uploader' : '/upload', //这是上传图片的路径,也就是我在web.xml里配置的servlet   'onUploadSuccess' : function(file, data, response) { //图片上传成功后返回数据在这里处理       var ary = eval("(" + data + ")").rows;       for(var i = 0; i < ary.length; i++) {           $("#J_div").append("<img alt='图片' src='/upload/images" + ary[i].name + "' width='200px' height='200px'>");       }      }  }); }); </script> </head> <body>  <h2>jQuery Uploadify + Apache Fileupload异步上传文件示例(2014-5-3)</h2>  <p>1、可以限制上传文件大小和类型,理论上任何类型的文件都可以上传(自己根据api配置即可);</p>  <p>2、后台使用Apache commons-fileupload-1.3.1.jar作为上传工具包,本示例支持一次性多文件上传;</p>  <p>3、文件上传目录可以任意指定,请在web.xml中配置;</p>  <p>4、对于已经上传的图片没有查询到这个页面上,这部分留给你去做吧。</p>  <p>Uploadify api 详见http://www.uploadify.com/documentation/</p>  <p style="color: red">*如果你对本示例感兴趣并想了解更多,欢迎加入Java私塾在线学习社区(329232140)。</p>  <input id="fileupload" type="file" name="img" multiple="multiple"/>  <div id="J_div"></div> </body> </html>
web.xml
<?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd" metadata-complete="true" version="3.0">   <welcome-file-list>    <welcome-file>test_upload.html</welcome-file>   </welcome-file-list>   <servlet>     <description>专门用来处理上传操作的servlet</description>         <servlet-name>FileUploadServlet</servlet-name>         <servlet-class>com.xiaoxing.upload.FileUploadServlet</servlet-class>         <init-param>          <description>文件存放的正式目录,可以自己配置</description>          <param-name>uploadDir</param-name>          <param-value>/upload/images/</param-value>         </init-param>         <init-param>          <description>文件存放的临时目录,可以自己配置,里的文件由下面配置的监听器自动删除。</description>          <param-name>tempUploadDir</param-name>          <param-value>/upload/temp</param-value>         </init-param>     </servlet>     <servlet-mapping>         <servlet-name>FileUploadServlet</servlet-name>         <url-pattern>/upload</url-pattern>     </servlet-mapping>     <listener>      <description>临时文件资源清理,工具包自带,不用我们来写</description>      <listener-class>org.apache.commons.fileupload.servlet.FileCleanerCleanup</listener-class>    </listener> </web-app>
  • 全部评论(0)
联系客服
客服电话:
400-000-3129
微信版

扫一扫进微信版
返回顶部