Jquery 生成下载文件时发出友好的等待消息

我正在调用生成Excel文件的Web服务，完成后用户可以下载该文件。 生成此文件大约需要20秒。有没有一种方法可以使用jQuery向用户提供一些反馈，这些反馈需要等待几秒钟，而不是状态栏。 我不希望保存或缓存服务器端的文件

我希望下面这样的方法能奏效，但显然不行

   var myhref = "DownloadFile.ashx?foo=bar"
   $.get(myhref, function (data) {
            window.location = this.href;
        },
        function (data) {
            alert("Could not generate file");

        });

因此，我想要的是在生成下载时保持ui的活动状态

这应该可以：

   <div id="waitMessage" style="display:none">
           Please wait while the file is generated
   </div>

<a href='DownloadFile.ashx?foo=bar' id='download'>Download me</a>


<script type="text/javascript">
        $(function () {           
            $("#download").click(function () {
                $("#waitMessage").fadeIn()
            });
        });
    </script>

正在生成文件，请稍候
$（函数（）{
$（“#下载”）。单击（函数（）{
$（“#waitMessage”）.fadeIn（）
});
});

占位符文本

---

函数示例\u ajax\u请求（）{
$（“#示例占位符”）.html（“
”）；
$（'#示例占位符'）.load（“/examples/ajax-load.html”）；
}

当我想用ajax执行一些动作时，我也遇到了类似的问题，这些动作虽然不需要花费太多时间，但足以让用户想到“发生了什么事？它在做我想做的吗？”

我发现了一个名为（真的很酷！）的jQuery插件，它在你处理东西时显示一条消息

下面是我如何使用它。首先是处理请求的函数：

function proceedToSend( requesterName, requesterId )
{
    //Here the wait/processing message is displayed
    $().ajaxStart($.blockUI({ message:$('#waitMessage')}));

    $.ajax({
        type    :"POST" ,
        url     : http://example.com/myurl.php
        dataType: yourDataType ,
        data    : myData ,
        success :function ( response )
        {
            //response processing if needed

            // Here the wait/processing messages is hidden
            $().ajaxStop($.unblockUI({ message:null }));
        } ,
        error   :function ()
        {
            alert('there was an error processing the request!!');
            $().ajaxStop($.unblockUI({ message:null }));
        }
    });
}

最后，您必须在页面上添加此项，以便显示消息：

<div id="waitMessage" class="dataContainer" style="display: none;">
    <p style="font-size: 30px;">Processing request...</p>
</div>

处理请求

---

就这样，希望能有所帮助！；）

这并不完全是我想要实现的用户体验。单击链接时，会显示div，但随后UI会冻结。我正在查找动画持续运行的位置，然后提供下载或显示错误消息。请用动画gif:“请稍候，同时生成文件”。）。我不知道你还想要什么。。。

function proceedToSend( requesterName, requesterId )
{
    //Here the wait/processing message is displayed
    $().ajaxStart($.blockUI({ message:$('#waitMessage')}));

    $.ajax({
        type    :"POST" ,
        url     : http://example.com/myurl.php
        dataType: yourDataType ,
        data    : myData ,
        success :function ( response )
        {
            //response processing if needed

            // Here the wait/processing messages is hidden
            $().ajaxStop($.unblockUI({ message:null }));
        } ,
        error   :function ()
        {
            alert('there was an error processing the request!!');
            $().ajaxStop($.unblockUI({ message:null }));
        }
    });
}

<div id="waitMessage" class="dataContainer" style="display: none;">
    <p style="font-size: 30px;">Processing request...</p>
</div>