JQuery 发布到下载文件

Question

您好，我有这方面的大部分代码，但缺少文件的“弹出”，因此我正在寻求帮助。

功能是这样的：用户填写报告表格，报告显示在屏幕上，用户有一个带有最终选项的按钮，可以单击它以 xls 格式下载报告并保存在本地。

我已将 xls 添加为 php，以便我可以 <table><tr><td></td><tr></table> 回电子表格

AddType application/x-httpd-php .xls

这在许多情况下是相当危险的，但在我的情况下，这是必不可少的（“电子表格”在内存中太大而无法以 HTML 伪格式以外的任何其他方式发送）所以即使这给了用户一个“你确定" 在 excel 中，这是迄今为止最不坏的选择。

好吧，撇开题外话不谈，我希望jQuery 按钮将post 数据转换为response.xls，然后像链接一样“下载”文件，这实际上比我想象的要难。另一种选择是获取整个字符串，但这对我来说太不雅了。

这是我目前所拥有的。

<button id="download">Download As Excel</button>
<script type="text/javascript">
    $(document).ready(function () { 
        $('#download').button(); 
        $('#download').click(function(){ 
            $.post("response.xls", 
            $("form#sendform").serialize(), 
                function(data){ 
                    alert(data); 
                    var win=window.open('about:blank'); 
                    with(win.document) { 
                      open(); 
                      write(data); 
                      close(); 
                    } 
                } 
            ); 
            return false; 
        }); 
    }); 
</script>

关键部分是通过重新序列化用户已经选择的预先存在的选项来工作。它有效：但它在弹出窗口中将文件打开为“html” - 这是错误的，我需要它来下载它，就好像它是一个链接一样。

任何想法都将受到欢迎。请注意，我经常使用这个技巧，但它始终是一个没有参数的静态 xls 文件（实际上是 <a href=\"report.xls\">Main Report</a> 的情况） - 所以这是明显不同的

Answer 1

下面的代码可以工作，你不能以上面概述的方式使用 $.post，你必须通过伪造一个伪造的 html 表单并提交它来“the old way”

    $('#download').click(function(){ 
            var form = document.createElement("form");
            form.setAttribute("method", "post");
            form.setAttribute("action", "response.xls");
            form.setAttribute("target", "_blank");
            $('form#sendform *').filter(':input').each(function(){
                if (typeof $(this).attr('name') != "undefined"){
                    var hiddenField = document.createElement("input");
                    hiddenField.setAttribute("name", $(this).attr('name'));
                    hiddenField.setAttribute("value", $(this).val());
                    form.appendChild(hiddenField);                      
                }
            });
            form.style.visibility="hidden";
            document.body.appendChild(form);
            form.submit();

        return false; 
    }); 

Answer 2

你可以试试这个，记得对你服务器上的数据进行base64：

<button id="download">Download As Excel</button>
<script type="text/javascript">
$(function () { 
    var btn = $('#download');
    btn.click(function(){ 
        btn.prop('disabled', true);
        $.post("response.xls", $("form#sendform").serialize(), 
            function(data){ 
                //data === base64'ified xsl
                location.href = 'data:application/vnd.ms-excel;base64,' + data;
            } 
        ); 
        return false; 
    }); 
}); 
</script>