网上找了很多资料都没有发现一个好用、可以用的uploadify批量上传的应用,这里通过官方和自己的一些项目需要整理了一个出来. 希望能帮助到需要的人。
效果图:
<script type="text/javascript" src="/skin/js/laydate/laydate.js"></script> <script type="text/javascript" src="/skin/js/uploadify/jquery.uploadify.min.js"></script> <script type="text/javascript" src="/skin/js/uploadify/uploadify.swf"></script> <script type="text/javascript"> $(document).ready(function () { $("#uploadFile").uploadify({ /*注意前面需要书写path的代码*/ 'swf': '/skin/js/uploadify/uploadify.swf', 'uploader': '/task/uploadhandler', //请求的Action 'cancelImg': '/skin/js/uploadify/cancel.png', 'method': 'get', 'queueID': 'fileQueue', //和存放队列的DIV的id一致 'fileObjName': 'uploadFile',//和input的name属性值保持一致就好,Struts2就能处理了 'auto': true, //是否自动开始 'multi': true, //是否支持多文件上传 'buttonText': '上传', //按钮上的文字 'simUploadLimit': 1, //一次同步上传的文件数目 'sizeLimit': 19871202, //设置单个文件大小限制 // 'fileDesc' : '支持格式:jpg/gif/jpeg/png/bmp.', //如果配置了以下的'fileExt'属性,那么这个属性是必须的 // 'fileExt' : '*.jpg;*.gif;*.jpeg;*.png;*.bmp',//允许的格式 'queueSizeLimit': 5, //限制在一次队列中的次数(可选定几个文件)。默认值= 999,而一次可传几个文件有 simUploadLimit属性决定。 'fileSizeLimit': 10 * 1024 * 1024, //设置单个文件大小限制,单位为byte ,10M 'removeCompleted': true, 'removeTimeout': 0.5, 'requeueErrors': true, // 'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal,queueBytesLoaded) { // $("#result").append("<div>文件\""+file.name+"\"共"+totalBytesTotal+"字节,已上传"+totalBytesUploaded + "字节!</div><br/>"); // if(totalBytesUploaded==totalBytesTotal){ // $("#result").append("<div>文件\""+file.name+"\"上传成功!</div><br/>"); // } // }, 'onUploadComplete': function (file) { // $("#result").append("<div>文件"+file.name+"上传成功!</div><br/>"); }, 'onUploadSuccess': function (file, data, response) { if ($("#hidFile").val() == "") { $("#hidFile").val(data); $("#showFile").text(data); } else { $("#hidFile").val($("#hidFile").val() + "|" + data + ""); $("#showFile").text($("#showFile").text() + ";" + data + ""); } }, 'onUploadError': function (file, errorCode, errorMsg, errorString, swfuploadifyQueue) { //$("#result").html(errorString); }, }); }); </script>