zoukankan      html  css  js  c++  java
  • js实现带上传进度的文件上传

    //获取文件筐的文件集合
    var files = document.getElementById("file1").files;
    //创建FormData对象  相当于参数集合  存储方式是键值对
    var formData = new FormData();
    //添加第一个文件到FormData
    formData.append("file", files[0]);
    //添加普通数据  后台直接参数接受
    formData.append("name", "KevinBlandy");
    //创建异步对象
    var xhr = new XMLHttpRequest();
    //打开连接
    xhr.open('POST', '/Home/UpFile', true);
    //监听上传事件
    if (xhr.upload) {
            //监听上传属性的上传事件,每次上传事件都会执行 progressHandlingFunction
            xhr.upload.addEventListener('progress', progressHandlingFunction, false);
            //xhr.upload.progress = function(){}            也可以
    }
    //执行上传
    xhr.send(formData);
    
    //上传监听 回调
    function progressHandlingFunction(event) {
            event.total;        //获取上传文件的总大小
            event.loaded;        //获取已经上传的文件大小
            //获取进度的百分比值
            let percent = (event.loaded / event.total) * 100;
               
            //四舍五入保留0位小数
            percent = percent.toFixed(0);
    var jd = document.getElementById("jd"); jd.value = percent; }
  • 相关阅读:
    OpenGL Pixel Linked-List
    Unity multi_compile
    Bindless Textures
    chmod递归设置文件属性
    push submodule
    NodeJS Debugger
    重载new操作符
    OpenGL瓶颈
    NGUI架构和Draw Call合并原理
    字符串哈希函数(String Hash Functions)
  • 原文地址:https://www.cnblogs.com/cc-net/p/10262561.html
Copyright © 2011-2022 走看看