1

如何在 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

4

1 回答 1

1

您可以beforeSend在 ajax 调用中使用来开始您的动画和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
            }
        });    
});
于 2013-09-27T05:22:03.613 回答