plupload上傳視頻等大文件

本文演示了新浪微博plupload上傳視頻文件,支持格式有mpg,m4v,mp4,flv,3gp,mov,avi,rmvb,mkv,wmv。本文的視頻上傳分兩步,首先選擇文件,而後點擊上傳按鈕開始上傳,您也能夠直接選擇文件上傳,具體請參考http://www.erdangjiade.com/js/863.html
本案例演示參考下這裏:  http://www.erdangjiade.com/js/874.html  
效果圖片以下:
 
完整代碼邏輯以下:
視頻類型文件上傳,支持中途取消上傳var uploader_video = new plupload.Uploader({//建立實例的構造方法     runtimes: 'gears,html5,html4,silverlight,flash', //上傳插件初始化選用那種方式的優先級順序     browse_button: ['video_upload_btn'], // 上傳按鈕     url: "ajax.php", //遠程上傳地址     flash_swf_url: 'js/plugins/plupload/Moxie.swf', //flash文件地址     silverlight_xap_url: 'js/plugins/plupload/Moxie.xap', //silverlight文件地址     filters: {         max_file_size: '10mb', //最大上傳文件大小(格式100b, 10kb, 10mb, 1gb)         mime_types: [//容許文件上傳類型             {title: "files", extensions: "mpg,m4v,mp4,flv,3gp,mov,avi,rmvb,mkv,wmv"}         ]     },     //       chunk_size: "5mb", //分片上傳文件時,每片文件被切割成的大小,爲數字時單位爲字節。也可使用一個帶單位的字符串,如"200kb"。當該值爲0時表示不使用分片上傳功能     multi_selection: false, //true:ctrl多文件上傳, false 單文件上傳     init: {         FilesAdded: function(up, files) { //文件上傳前              $("#video_name_box").css({"display": "inline-block"});             $("#video_upload_btn").hide();             $("#video_file_name").text(files[0].name);             $("#upload_video").removeClass("disabled");              $("#upload_video").click(function() {                 uploader_video.start(); //調用實例對象的start()方法開始上傳文件,固然你也能夠在其餘地方調用該方法             })             $("#video_iput").attr("file_id", files[0]['id'])             //                    console.log(files);         },         UploadProgress: function(up, file) { //上傳中,顯示進度條             $("#video_loading").show();             $('#upload_video_area,#video_upload_area').hide();             var percent = file.percent;             $("#percent").css({"width": percent + "%"});             $("#percentnum").text(percent + "%");             $("#video_success").hide();          },         FileUploaded: function(up, file, info) { //文件上傳成功的時候觸發             $("#video_loading").hide();             $("#video_success").show();             var data = eval("(" + info.response + ")");//解析返回的json數據             $("#video_iput").html("<input type='hidden'id='video_file' value='" + data.pic + "'/><input type='hidden'id='video_name' value='" + data.name + "'/>");         },         Error: function(up, err) { //上傳出錯的時候觸發             alert(err.message);         }     } }); uploader_video.init();
相關文章
相關標籤/搜索