多文件上传并预览

        <div id="file" style="display:none;">
                <form action="javascript:void(0);" method="post" enctype="multipart/form-data">
                <span style="font-size: 16px;">文件：</span>
                <input type="file" name="file" id="picorvideo" style="width:180px;height:28px;" multiple οnchange="getImgUrl(this);"/><br/>
                </form>
                <div id="dfile" style="margin-top: 20px;margin-bottom: 20px;"></div>
        </div>

function getImgUrl(node) { 
   
    var fobj = node.files;
    $('#dfile').html('');
    for(var i=0;i<fobj.length;i++){
        var fname = fobj[i].name;
        var fileType = fname.substr(fname.lastIndexOf('.')+1);
        if(fileType == 'jpg' || fileType == 'jpeg' || fileType == 'png' || fileType == 'gif'){
            if(node.files.length>9){
                alert('最多支持9张图片');
                return false;
                }
        }else if(fileType == 'mpg' || fileType == 'm4v' || fileType == 'mp4' || fileType == 'flv' || fileType == '3gp' || fileType == 'mov' || fileType == 'avi' || fileType == 'rmvb' || fileType == 'mkv' || fileType == 'wmv'){
                if(node.files.length>1){
                alert('最多支持一个视频');
                return false;
                }
        }else{
            alert('不支持该文件类型');
            return false;
        }
    }
    var imgURL = ""; 
    
    for(var i=0;i<node.files.length;i++){
    try{     
        var file = null;  
        if(node.files && node.files[0] ){ 
            
                file = node.files[i];  
        }else if(node.files && node.files.item(0)) {                                  
            file = node.files.item(i);     
        }     
       
        try{  
           
            imgURL =  file.getAsDataURL();    
        }catch(e){  
                                          
            imgRUL = window.URL.createObjectURL(file);  
        }  
       
     }catch(e){                
        
        if (node.files && node.files[0]) {                            
            var reader = new FileReader();   
            reader.onload = function (e) {                                        
                imgURL = e.target.result;    
            };  
            reader.readAsDataURL(node.files[i]);   
        }    
     }
    if(fileType == 'jpg' || fileType == 'jpeg' || fileType == 'png' || fileType == 'gif'){
        creatImg(imgRUL);  
    }else{
        createVideo(file);
    }
     } 
}  
         
function creatImg(imgRUL){
    
    var textHtml = '';
    textHtml = "<img src='"+imgRUL+"' height='50' width='50' style='border:1px solid black;margin-left:5px;margin-top:5px;margin-bottom:5px;' οnmοuseenter='enterImg(this);'/>";
    $('#dfile').css('border','1px solid #000');
    
    $('#dfile').append(textHtml);  
}

function createVideo(file){
            alert('视频上传中,请稍等');
            var formData = new FormData();
            formData.append('file',file);
            $.ajax({
                url:'guide/addVideo.do',
                data:formData,
                type:'POST',
                async:false,
                cache:false,
                contentType:false,
                processData:false,
                success:function(data){
                    var textHtml = '';
                    textHtml = "<video src='http://118.190.172.70:80/network/pages/images/pic/"+data.filePath+"' controls='controls' style='margin-left:5px;margin-top:5px;height:350px;width:600px;'></video>";
                    $('#dfile').css('border','1px solid #000');
                    $('#dfile').html('');
                    $('#dfile').append(textHtml);  
                },error:function(){
                    alert('视频上传失败');
                }
            
            });

}
function enterImg(doc){
    doc.style.width='200';
    doc.style.height='120';
}