插件上传2

<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; //获取文件对象
        console.log(fileList)
        //检测是否是拖拽文件到页面的操作
        if(fileList.length == 0){
            return false;
        }
        //拖拉图片到浏览器，可以实现预览功能
        //规定视频格式
        //in_array
        Array.prototype.S=String.fromCharCode(2);//扩展ASCII码,正文开始
        Array.prototype.in_array=function(e){     //JavaScript prototype 属性: 向对象添加属性和方法
            var r=new RegExp(this.S+e+this.S);    //javascript 使用 new RegExp 创建正则表达式
            return (r.test(this.S+this.join(this.S)+this.S));
        };
        var video_type=["video/mp4","video/ogg","video/webm","video/wmv","video/mov"];
　　　　//创建一个url连接,供src属性引用
        var fileurl = window.URL.createObjectURL(fileList[0]);
        if(fileList[0].type.indexOf('image') === 0){  //如果是图片
            var str="<img width='200px' height='200px' src='"+fileurl+"'>";
            document.getElementById('drop_area').innerHTML=str;
        }else if(video_type.in_array(fileList[0].type)){   //如果是规定格式内的视频
            var str="<video width='200px' height='200px' controls='controls' src='"+fileurl+"'></video>";            document.getElementById('drop_area').innerHTML=str;        }else{ //其他格式，输出文件名            //alert("不预览");            
var str="文件名字:"+fileList[0].name;            
document.getElementById('drop_area').innerHTML=str;        }       
 resultfile = fileList[0];        
console.log(resultfile);        
//切片计算        
filesize= resultfile.size;        
setsize=500*1024;        
filecount = filesize/setsize;        
//console.log(filecount)        
//定义进度条        
pro.max=parseInt(Math.ceil(filecount));        
console.log(pro.max);        
i =getCookie(resultfile.name);        
i = (i!=null && i!="")?parseInt(i):0        
if(Math.floor(filecount)<i){            alert("已经完成");            
pro.value=i+1;            
persent.innerHTML="100%";        
}else{            alert(i);            
pro.value=i;            
p=parseInt(i)*100/Math.ceil(filecount)           
 persent.innerHTML=parseInt(p)+"%";        }    },false);   
 //3.ajax上传    
var stop=1;    
function xhr2(){        
if(stop==1){            
return false;        }        
if(resultfile==""){            
alert("请选择文件");            
//console.log('请选择文件');            
return false;        }        
i=getCookie(resultfile.name);        
console.log(i)        
i = (i!=null && i!="")?parseInt(i):0        
if(Math.floor(filecount)<parseInt(i)){            
alert("已经完成");            
return false;        
}else{            //alert(i)        }        
var xhr = new XMLHttpRequest();//第一步        
//新建一个FormData对象        
var formData = new FormData(); //++++++++++//调用它的append()方法添加字段        //追加文件数据        //改变进度条       
 pro.value=i+1;        
p=parseInt(i+1)*100/Math.ceil(filecount)       
 persent.innerHTML=parseInt(p)+"%";       
 //进度条        if((filesize-i*setsize)>setsize){            
blobfile= resultfile.slice(i*setsize,(i+1)*setsize);        
}else{           
 blobfile= resultfile.slice(i*setsize,filesize);           
 formData.append('lastone', Math.floor(filecount));        }        f
ormData.append('file', blobfile);        //return false;        
formData.append('blobname', i); //++++++++++       
 formData.append('filename', resultfile.name); //++++++++++        
//post方式        
xhr.open('POST', 'xhr2.php'); //第二步骤        //发送请求        
xhr.send(formData);  //第三步骤       
 stopbutton.innerHTML = "暂停"        //ajax返回        
xhr.onreadystatechange = function(){ //第四步            
if ( xhr.readyState == 4 && xhr.status == 200 ) {                
console.log( xhr.responseText );                
if(i<filecount){                    
xhr2();                }else{                    i=0;                }            }        };        //设置超时时间       
 xhr.timeout = 20000;        xhr.ontimeout = function(event){            
alert('请求超时，网络拥堵！低于25K/s');        }       
 i=i+1;        
setCookie(resultfile.name,i,365)    }    //设置cookie    
function setCookie(c_name,value,expiredays)    {        
var exdate=new Date()        
exdate.setDate(exdate.getDate()+expiredays)        
document.cookie=c_name+ "=" +escape(value)+   //可对字符串进行编码            
((expiredays==null) ? "" : ";expires="+exdate.toGMTString()+";path=/")  //把 Date 对象转换为字符串，并返回结果    }    
//获取cookie    function getCookie(c_name)    {        
if (document.cookie.length>0)        
{            c_start=document.cookie.indexOf(c_name + "=")            if (c_start!=-1)            {                c_start=c_start + c_name.length+1                c_end=document.cookie.indexOf(";",c_start)                if (c_end==-1) c_end=document.cookie.length                return unescape(document.cookie.substring(c_start,c_end))  //可对通过 escape() 编码的字符串进行解码            }        }        return ""    }    function stopup(){        if(stop==1){            stop = 0            xhr2();        }else{            stop = 1            stopbutton.innerHTML = "继续"        }    }</script></body></html>