zoukankan      html  css  js  c++  java
  • XmLHttpRequst下载Excel

     //得到浏览器版本
        myJqHelp.getBrowser = function () {
    
            var ua = window.navigator.userAgent;
            var isIE = !!window.ActiveXObject || "ActiveXObject" in window;
            var isFirefox = ua.indexOf("Firefox") != -1;
            var isOpera = window.opr != undefined;
            var isChrome = ua.indexOf("Chrome") && window.chrome;
            var isSafari = ua.indexOf("Safari") != -1 && ua.indexOf("Version") != -1;
            if (isIE) {
                return "IE";
            } else if (isFirefox) {
                return "Firefox";
            } else if (isOpera) {
                return "Opera";
            } else if (isChrome) {
                return "Chrome";
            } else if (isSafari) {
                return "Safari";
            } else {
                return "Unkown";
            }
        }
        //字节转换
        myJqHelp.bConvertKBMBGB = function (limit) {
            var size = "";
            if (limit < 0.1 * 1024) { //如果小于0.1KB转化成B
                size = limit.toFixed(2) + "B";
            } else if (limit < 0.1 * 1024 * 1024) {//如果小于0.1MB转化成KB
                size = (limit / 1024).toFixed(2) + "KB";
            } else if (limit < 0.1 * 1024 * 1024 * 1024) { //如果小于0.1GB转化成MB
                size = (limit / (1024 * 1024)).toFixed(2) + "MB";
            } else { //其他转化成GB
                size = (limit / (1024 * 1024 * 1024)).toFixed(2) + "GB";
            }
    
            var sizestr = size + "";
            var len = sizestr.indexOf(".");
            var dec = sizestr.substr(len + 1, 2);
            if (dec == "00") {//当小数点后为00时 去掉小数部分
                return sizestr.substring(0, len) + sizestr.substr(len + 3, 2);
            }
            return sizestr;
        }
        //加载进度条
        myJqHelp.loadingProgress = function (domId) {
            var mask_bg = document.createElement("div");
            mask_bg.id = domId;
            mask_bg.style.position = "absolute";
            mask_bg.style.top = "0px";
            mask_bg.style.left = "0px";
            mask_bg.style.width = "100%";
            mask_bg.style.height = "100%";
            mask_bg.style.backgroundColor = "rgba(7, 7, 7, 0.5)";
            mask_bg.style.zIndex = 10001;
            document.body.appendChild(mask_bg);
    
            var mask_msg = document.createElement("div");
            mask_msg.style.position = "absolute";
            mask_msg.style.top = "35%";
            mask_msg.style.left = "42%";
            mask_msg.style.width = "20%";
            mask_msg.style.backgroundColor = "white";
            mask_msg.style.border = "#336699 1px solid";
            mask_msg.style.textAlign = "center";
            mask_msg.style.fontSize = "1.1em";
            mask_msg.style.fontWeight = "bold";
            mask_msg.style.padding = "0.5em 3em 0.5em 3em";
            mask_msg.style.zIndex = 10002;
            var progressBar = $(`<div class="progress progress-striped active">
                        <div class="progress-bar progress-bar-success"
                            style=" 0%;">
                        </div>
                    </div><span name='progress'>0/0</span>`);
            progressBar.css("z-index", 10003);
            $(mask_msg).append(progressBar);
            mask_bg.appendChild(mask_msg);
        }
        //关闭进度条
        myJqHelp.closeProgress = function (domId) {
            var mask_bg = document.getElementById(domId);
            if (mask_bg != null)
                mask_bg.parentNode.removeChild(mask_bg);
        }
        //excel下载带进度条
        myJqHelp.excelDownLoad = function (url, progressId, fileName, type) {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", url);
            xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
            xhr.responseType = "blob";
            xhr.addEventListener("loadstart", function (ev) {
                myJqHelp.loadingProgress(progressId);
                // 开始下载事件:下载进度条的显示
                $('div.progress-bar').css('width', "0%");
                $("span[name='progress']").text("0/0");
            });
            xhr.addEventListener("progress", function (ev) {
                // 下载中事件:计算下载进度
                var max = ev.total;
                var value = ev.loaded;
                var width = value / max * 100;
                $('div.progress-bar').css('width', width + "%");
                $("span[name='progress']").text(myJqHelp.bConvertKBMBGB(value) + "/" + myJqHelp.bConvertKBMBGB(max));
            });
            xhr.addEventListener("load", function (ev) {
                // 下载完成事件:处理下载文件
                if (type == "2003") {
                    type = "application/vnd.ms-excel";
                } else {
                    type = "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
                }
                if (this.status == 200) {
                    var blob = this.response;
                    var browser = myJqHelp.getBrowser();
                    if (browser == "Chrome") {
                        var link = document.createElement('a');
                        var file = new Blob([blob], { type: type });
                        link.href = window.URL.createObjectURL(file);
                        link.download = fileName;
                        link.click();
                        window.URL.revokeObjectURL(link.href);
                    } else if (browser == "Firefox") {
                        var file = new File([blob], fileName, { type: type });
                        var url = URL.createObjectURL(file);
                        parent.location.href = url;
                        window.URL.revokeObjectURL(url);
                    }
                    //else if (browser == "IE") {
                    //    var file = new Blob([blob], { type: 'application/force-download' });
                    //    window.navigator.msSaveBlob(file, fileName);
                    //}
                }
            });
            xhr.addEventListener("loadend", function (ev) {
                // 结束下载事件:下载进度条的关闭
                myJqHelp.closeProgress(progressId);
            });
            xhr.addEventListener("error", function (ev) {
            });
            xhr.addEventListener("abort", function (ev) {
            });
            xhr.send();
        }

    基于bootstrap样式、与jq。

    使用方法:

    myJqHelp.excelDownLoad(url, "myProgress","orders.xls","2003");

  • 相关阅读:
    springmvc
    POJ 3683 Priest John's Busiest Day
    POJ 3678 Katu Puzzle
    HDU 1815 Building roads
    CDOJ UESTC 1220 The Battle of Guandu
    HDU 3715 Go Deeper
    HDU 3622 Bomb Game
    POJ 3207 Ikki's Story IV
    POJ 3648 Wedding
    HDU 1814 Peaceful Commission
  • 原文地址:https://www.cnblogs.com/gaocong/p/5607385.html
Copyright © 2011-2022 走看看