這個是我近期用jq和原聲寫的視訊上傳,

獲取視訊檔案的各種資訊並做處理:

	//上傳視訊
	$(function(){
		$('#upload_video').click(function(){
			$('#upload_video_').click();
		});

		$('#upload_video_').bind('change', function (evt) {
			//限制檔案大小
			var fileSize = document.getElementById('upload_video_').files[0].size;
			if(fileSize>=1024*1024*20)
			{
				box.msg('上傳視訊超出大小，請選擇小一點的視訊！');
				return false;
			}
			box.loading('正在上傳...');
			//上傳檔案
			var fd = new FormData();
			fd.append("fileToUpload", document.getElementById('upload_video_').files[0]);
			var xhr = new XMLHttpRequest();
			//進度
//			xhr.upload.addEventListener("progress", uploadProgress, false);
			//成功返回
			xhr.addEventListener("load", uploadComplete, false);
			//失敗返回
			xhr.addEventListener("error", uploadFailed, false);
			xhr.addEventListener("abort", uploadCanceled, false);
			//請求地址
			xhr.open("POST", "{:U('Upload/upload_video_form_tx')}");
			xhr.send(fd);
		});

		//進度條
		function uploadProgress(evt) {
			if (evt.lengthComputable) {
				//計算進度
				var percent = parseInt(Math.round(evt.loaded * 100 / evt.total));
				$('#progressNumber').html(percent + '%');
				if(percent == 100){
					$('#progressNumber').hide();
					box.loading('正在處理視訊..');
				}
			}
			else {
				box.loading('正在上傳...');
			}
		}

		//返回值
		function uploadComplete(evt) {
			var data = JSON.parse(evt.target.responseText);
			if(data.ret == 1)
			{
				//視訊資訊儲存
				save_video(data.path);
				box.close();
				box.msg('上傳成功!');
			}
		}
		//視訊存入資料庫
		function save_video(path)
		{
			$.post("{:U('TechManager/saveVideo')}",{path:path},function(data){
				if(data.ret == false){
					box.msg('上傳失敗，請重新嘗試！');
				} else {
					path = 'http://huijing10-10046087.video.myqcloud.com'+path;
					save_video_for_tech(data.id);
					album_video(data.id,path);
				}
			},'json');
		}
		//顯示上傳的視訊
		function album_video(id,path)
		{
			//刪除之前上傳的視訊
			del_video();
			//顯示上傳的視訊
			html  =  '<img src="__IMG__/vd_sing_min.png" style="width: 100%;height:100%" video_id="' + id + '" />'; //稽核中封面
//			html =	'<video  src="' + path + '" video_id="' + id + '" width=100% height=100% poster="'+video_cover+'" >' +	//video標籤去掉
//					'<source src="' + path + '" type="video/ogg">' +
//					'<source src="' + path + '" type="video/mp4">' +
//					'<source src="' + path + '" type="video/webm">' +
//					'<object data="' + path + '" >' +
//					'<embed  src="' + path + '">' +
//					'</object>' +
//					'</video>';
			var album_id = id;
			$('#album_video').attr('album_id',album_id);
			$('#upload_video').html(html);
		}
		function uploadFailed(evt) {
			box.close();
			box.msg('上傳失敗，請重新嘗試！');
		}
		function uploadCanceled(evt) {
			box.close();
			box.msg('上傳失敗，請重新嘗試！');
		}

		//把上傳的視訊放到資料庫
		function save_video_for_tech(album_video)
		{
			$.post("{:U('TechManager/ajaxPackage')}",{data_type:3,album_video:album_video},function(data){
			});
		}
		//刪除視訊
		function del_video()
		{
			var video_id = $('#upload_video').find('img').attr('video_id');
			if(video_id){
				$.post("{:U('TechManager/album_video_del')}", {'video_id': video_id}, function (ret) {
				});
			}
		}
	});

前端程式碼

<div class="dr_img" id="upload_video"></div>
<input name="upload_video_" id="upload_video_" type="file" accept="video/*" enctype="multipart/form-data"   class="hidd" onclick="this.form.reset();">