视频ajax拖拽上传详解.doc

视频Ajax拖拽上传 断点续传 后台效果： 前台效果图： 后台实现过程： 在languages/zh_cn/admin/goods.php中插入 $_LANG[tab_video] = 视频上传; (图1) 2显示标签 在admin/templates/goods_info.htm中 将span class=tab-back id=video-table{$lang.tab_video}/span 写入到div id=tabbar-div里 如下图 然后，在form标签中将下面代码粘贴在下图之上 table width=90% id=video-table align=center style=display:none; tr td div id=drop_area style=border:3px dashed silver;width:200px; height:200px 将图片拖拽到此 /div input type=hidden id=video_val name=goods_video progress value=0 max=10 id=prouploadfile/progress span id=persent0%/span br / !--button onclick=xhr2()ajax上传/button-- input type=button onclick=stopup() id=stop value=上传 script //拖拽上传开始 //-1.禁止浏览器打开文件行为 document.addEventListener(drop,function(e){ //拖离 e.preventDefault(); }) document.addEventListener(dragleave,function(e){ //拖后放 e.preventDefault(); }) document.addEventListener(dragenter,function(e){ //拖进 e.preventDefault(); }) document.addEventListener(dragover,function(e){ //拖来拖去 e.preventDefault(); }) //上传进度 var pro = document.getElementById(prouploadfile); var persent = document.getElementById(persent); function clearpro(){ pro.value=0; persent.innerHTML=0%; } //2.拖拽 var stopbutton = document.getElementById(stop); var resultfile=; var box = document.getElementById(drop_area); //拖拽区域 box.addEventListener(drop,function(e){ var fileList = e.dataTransfer.files; //获取文件对象