使用处理程序下载文件时显示百分比的进度条

我想在按钮上单击下载 .EXE 文件并在网页上显示下载进度条而不是浏览器进度条 . 这个开发背后的想法是浏览器在他的下载管理器中隐藏它的下载进度条 .

我想在下载达到100％后自动运行.EXE .

我试图开发如下代码 . 它只是在浏览器控制台中看到时下载文件，但无法显示进度条和百分比 .

HTML Markup:

<div>
    <input type="button" value="Download" onclick="downfile();" />
</div>
<div id="progressCounter"></div>

JavaScript Logic:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
    function downfile() {
        var myTrigger;
        var progressElem = $('#progressCounter');
        $.ajax({
            type: 'POST',
            url: 'Download.ashx',
            beforeSend: function (thisXHR) {
                myTrigger = setInterval(function () {
                    if (thisXHR.readyState > 2) {
                        var totalBytes = thisXHR.getResponseHeader('Content-length');
                        var dlBytes = thisXHR.responseText.length;
                        (totalBytes > 0) ? progressElem.html(Math.round((dlBytes / totalBytes) * 100) + "%") : progressElem.html(Math.round(dlBytes / 1024) + "K");
                    }
                }, 200);
            },
            complete: function () {
                clearInterval(myTrigger);
            },
            success: function (response) {
                alert('done');
            }
        });
    }
</script>

Download.ashx

public void ProcessRequest (HttpContext context) {
    string filename = "ccsetup403.exe";
    string path = HttpContext.Current.Server.MapPath("~/" +filename);
    context.Response.ContentType = "application/octet-stream";
        context.Response.AddHeader("content-disposition", "attachment;  filename=" + filename);

        FileStream fs = new FileStream(path, FileMode.Open);
        BinaryReader br = new BinaryReader(fs);
        byte[] bin = br.ReadBytes(Convert.ToInt32(fs.Length));
        context.Response.BinaryWrite(bin);
        context.Response.End();
        fs.Close();
  }

Most welcome to other ideas.

请让我知道，如果你有任何问题 .