JQuery上傳插件Uploadify使用詳解

jopen 9年前發布 | 63K 次閱讀 Uploadify 文件上傳

1：準備工作

      官方下載地址： http://www.uploadify.com/download/

2：引入文件 
<link href="uploadify.css" rel="stylesheet">

     



      


                <script src="jquery.uploadify.min.js"></script>

      


 </div>



</pre></div>














3：前臺頁面 




<input type="hidden" id="filepathInput" />

     



      


                <input type="file" id="btnUploadify" name="uploadify" />

      


  <div>

            <div id="show_back"></div>

  </div>

 </div>



</pre></div>














4:初始化控件 
 function initUploadify() {
            $("#btnUploadify").uploadify({
                height: 30,
                swf: "uploadify.swf",
                cancelImage: "uploadify-cancel.png",
                uploader: 'common/op/uploadFileForMedia.shtml?type=video',
                fileTypeDesc: '視頻類型',
                fileTypeExts: '*.mp4',
                width: 100,
                multi: false,
                fileSizeLimit : '10MB', //設置單個文件大小限制 
                method: 'post',
                fileObjName: 'uploadify',
                buttonText: "選擇文件",
                onUploadSuccess: function (file, data, response) {
                    //上傳成功
                    if (response) {
                        var dataJson = eval("(" + data + ")");
                        $("#filepathInput").val(dataJson.filePath);
                        var html = '<video controls=controls autoplay=autoplay> '
                        +'<source src="'+ dataJson.basepath + "\/" + dataJson.filename+'" type="video/mp4" />'
                        +'</video>';
                        $("#show_back").html(html);
                    }
                },
                onUploadError : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {

                },
                auto: true

            });
        }
        







5：后臺代碼 
public class FileUploadAction extends BaseAction {

    private File uploadify;
    private String uploadifyFileName;

    public String uploadFile() throws Exception {
        map = new HashMap<String, Object>();
        // 上傳完后文件存放位置
        String savePath = getRealPath() + "upload";
        System.out.println(savePath);
        String newsuffix = "";
        String current = UUID.randomUUID().toString();
        if ((uploadifyFileName != null) && (uploadifyFileName.length() > 0)) {
            int dot = uploadifyFileName.lastIndexOf(".");
            if ((dot > -1) && (dot < (uploadifyFileName.length() - 1))) {
                newsuffix = uploadifyFileName.substring(dot + 1);
            }
        }
        FileInputStream fis = null;
        FileOutputStream fos = null;
        try {
            fis = new FileInputStream(uploadify);
            String serPath = savePath + File.separatorChar + current + "."
                    + newsuffix;
            fos = new FileOutputStream(serPath);
            IOUtils.copy(fis, fos);
            map.put("filename", current + "." + newsuffix);
            map.put("basepath", "upload/");
        } catch (Exception e) {
            e.printStackTrace();
        } finally {
            if (fos != null) {
                fos.flush();
                fos.close();
            }
            if (fis != null) {
                fis.close();
            }
        }
        return "toResult";
    }


}





                    

                    

                        
 本文由用戶 jopen 自行上傳分享，僅供網友學習交流。所有權歸原作者，若您的權利被侵害，請聯系管理員。

                        
 轉載本站原創文章，請注明出處，并保留原始鏈接、圖片水印。

                        
 本站是一個以用戶分享為主的開源技術平臺，歡迎各類分享！

                        
                        
                    


                

                

                    

                        
相關經驗

                        
                    

                    

                        
相關資訊

                        
                    

                    

                        
相關文檔