<form id="uploadform" method="post" enctype="multipart/form-data">

 上传视频：<input type="file" id="file" name="file" onchange="uploadfile()"/>

                    进度：

 　　　　　<progress id="progressBar" value="0" max="100"></progress>

     　　　  <span id="percentage"></span>

 </form>

<script type="text/javascript">

function uploadfile() {

    var fileObj = document.getElementById("file").files[0]; // js 获取文件对象

    var FileController = "teacher/uploadvideo.action";    // 接收上传文件的后台地址 

    // FormData 对象

    var form = new FormData($( "#uploadform" )[0]);

    // XMLHttpRequest 对象

    var xhr = new XMLHttpRequest();

    xhr.open("post", FileController, true);

    xhr.onload = function () {

       // alert("上传完成!");

    };

    xhr.upload.addEventListener("progress", progressFunction, false);

    xhr.send(form);

}

function progressFunction(evt) {

    var progressBar = document.getElementById("progressBar");

    var percentageDiv = document.getElementById("percentage");

    if (evt.lengthComputable) {

        progressBar.max = evt.total;

        progressBar.value = evt.loaded;

        percentageDiv.innerHTML = Math.round(evt.loaded / evt.total * 100) + "%";

        if(evt.loaded==evt.total){

            alert("上传完成100%");

        }

    }

}

</script>

@RequestMapping("/teacher/uploadvideo")

    public void uploadVideo(@RequestParam("file") MultipartFile uploadFile,String opid,HttpServletRequest request) throws IllegalStateException, IOException {

        System.out.println(opid);

        //获取文件初始名称

        String originalFileName = uploadFile.getOriginalFilename();

        Operation ope = operationService.getOpeByid(opid);

        String video = ope.getVideourl();

        String houzhui = originalFileName.substring(originalFileName.lastIndexOf("."));

        //上传文件

        String newFileName = UUID.randomUUID()+houzhui;

        File newFile = new File(videoUrl,newFileName);

        uploadFile.transferTo(newFile);

        //删除原有文件

        String oldVideoUrl = videoUrl + "/" + video;

        File videoFile = new File(oldVideoUrl);

        if(videoFile.exists()) {

            videoFile.delete();

        }

        ope.setVideourl(newFileName);

        operationService.modify(ope);

    }