zoukankan      html  css  js  c++  java
  • js 实时获取后台数据 Spring

      bootstrap进度条

    <div id="Blenght" class="progress progress-striped" style="display:none; 300px;height: 15px;margin-left:45px;margin-bottom: 1px;">
                        <div id="my-bar-success" class="progress-bar progress-bar-success my-bar-success" role="progressbar"
                             aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"
                             style=" 0%;">
                        </div>
                        <div id="countNum" class="len-countNum">
                        <em id="style-em-1" class="em-style"></em><em id="style-em-2" class="em-style"></em></div>
    </div>

       var formData = new FormData(document.getElementById('表单id'));  
        var xhr = new XMLHttpRequest();
        xhr.open('post', 'getbar', true); //getbar为请求路径  请求获取后台实时改变的session值  上传案例
        xhr.upload.addEventListener("progress", progressZipFilesFunction, false);//progressZipFilesFunction 回调函数
        xhr.send(formData);

    function progressZipFilesFunction(evt) {
        if (evt.lengthComputable) {
            var bRead = evt.loaded;
            var cLength = evt.total;
            var mBRead = Math.floor(bRead / 1024 / 1024); //实时上传的MB 取整
            var aRate = bRead / cLength * 100;
            var mCLength = Math.floor(cLength / 1024 / 1024); //视频大小
            $("#style-em-1").html(mBRead + "M/");
            $("#style-em-2").html(mCLength + "M");
            aRate = aRate.toFixed(2);
            $("#my-bar-success").css("width", aRate + "%");
            if(bRead==cLength){
                layer.alert("成功", {
                    icon: 1
                },
                function() {
                    $("#myModal2").modal("hide");
                    window.location.reload();
                });
            }
        }

    }3

  • 相关阅读:
    Android升级ADT22后会报ClassNotFoundException的原因分析
    修改Android解锁界面
    Android中dip, dp, px,pt, sp之间的区别:
    移动开发:Android官方提供的支持不同屏幕大小的全部方法
    常用正则表达式
    Android多语言与国际化
    Android中的资源与国际化
    Android开发:使用Fragment改造TabActivity
    Android开发–Intent-filter属性详解
    Fragment、Activity比较——Android碎片介绍
  • 原文地址:https://www.cnblogs.com/jiahaoJAVA/p/8027807.html
Copyright © 2011-2022 走看看