如何显示 MVC4 页面的下载进度

本文关键字：下载 MVC4 何显示 显示 | 更新日期: 2023-09-27 18:33:10

如何在 MVC4 页面上实现指示文件正在下载的下载进度条或动画 gif。下载进度条动画应从单击"下载"按钮开始。如何识别下载何时完成以隐藏动画。

我正在考虑显示和隐藏下面的div以指示进度

<div id="divLoading" style="margin: 0px; padding: 0px; position: fixed; right: 0px;
    top: 0px; width: 100%; height: 100%; background-color: #666666; z-index: 30001;
    opacity: .8; filter: alpha(opacity=70);display:none" >
    <p style="position: absolute; top: 30%; left: 45%; color: White;">
        Downloading, please wait...<img src="../../../../Content/images/ajax-dowloading.gif" />
    </p>
</div>

如下所示

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnDownload").click(function (e) {

         }
});

用户也可能在正在进行的下载操作期间取消下载。如何检测用户是否取消了下载。如果用户取消了下载，我想隐藏div

如何显示 MVC4 页面的下载进度

您可以在 ajax 调用中使用beforeSend来开始动画，success隐藏动画，如下所示：

$("#buttonId").click(function() {    
       $.ajax({
            type: "POST", //Your type
            url: "someURL" // Your URL
            data: //Your Data,
            beforeSend: function(msg){
                 // Show animation code here
            },
            success: function(msg){
                  // hide animation code here
            }
        });    
});
相关文章：