尝试获取等待状态以使用文件下载

时间:2017-05-23 21:16:12

标签: javascript c# jquery asp.net

环境:.Net 3.5,jQuery 2.1.4,IE9支持

似乎无法获得等待状态(spin.gif),使用通用处理程序执行文件下载,然后使等待状态消失。问题是我没有得到下载文件的对话框。

aspx - 客户端

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="WebApplication3._default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="jquery.js"></script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <input id="Button1" type="button" value="button" /><img src="spin.gif" id="Spin1" style="display: none;" />
        </div>

    </form>
    <script>
        window.onload = function () {
            var btn1 = document.getElementById('Button1');
            var spn1 = document.getElementById('Spin1');
            btn1.onclick = function () {
                //alert('achievement unlocked!');

                //window.location = "handler1.ashx";
                $.ajax({
                    beforeSend: function () { spn1.style.display = "inline-block" },
                    url: "handler1.ashx",
                    type: "POST",
                    success: function (result) {
                        spn1.style.display = "none";
                        //alert('done.')
                    }
                });

            }
        }
    </script>
</body>
</html>

ashx - 服务器

public class handler1 : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        Thread.Sleep(5000);

        //Download the CSV file.
        context.Response.Clear();
        context.Response.Buffer = true;
        context.Response.AddHeader("content-disposition", "attachment;filename=SqlExport.csv");
        context.Response.Charset = "";
        context.Response.ContentType = "application/text";
        context.Response.Output.Write("Hello, World");
        context.Response.Flush();
        context.Response.End();
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

2 个答案:

答案 0 :(得分:0)

你的JS代码看起来很可行 - 因为我无法访问它的服务器端,我在你发布的代码中替换了setTimeout()调用的ajax和回调。运行代码段并单击按钮 - 旋转图像(当然缺少源),2秒后它就消失了。

所以我猜你正在体验微调器出现但不会消失,所以我期待ajax的一些问题。是什么让你觉得它有效?

&#13;
&#13;
3 x 3
&#13;
M
&#13;
&#13;
&#13;

答案 1 :(得分:0)

您可以删除"content-disposition", "attachment;标题。使用success元素,$.ajax()属性,<a>

download Blob URL下载商品文件
var a = $("<a>", {download:"SqlExport.csv"}), blob, url;

$.ajax({
  beforeSend: function () { spn1.style.display = "inline-block" },
  url: "handler1.ashx",
  type: "POST",
  success: function (result) {
             spn1.style.display = "none";
             blob = new Blob([result], {type:"text/plain"});
             url = URL.createObjectURL(blob);
             a.attr("href", url);     
             $("body").append(a);            
             a[0].click();
             $(window).one("focus", function() {
               URL.revokeObjectURL(url);
               if (blob.close) blob.close();
               a.remove();
             });
           }
});