JQuery按照form下载文件+后台asp.net，非ajax(上)

来源：互联网发布：linux 物理网卡编辑：程序博客网时间：2024/05/22 07:50

最近搞web开发，发现要从服务器下载文件，折腾了很久。

项目采用的easyui一套框架，通过ajax发现无法下载到文件。后来找了很多文章看，最后才发现用表单方式搞定了。

还有了，后台用的是asp.net，框架是别人写好的，发现用GET方式竟然不行，最后采用了POST方式。

先看看效果。点击全部导出按钮时

直接弹框。

效果是达到了。

那接下看看代码层面是怎么做到的。

代码：

1、前端JS+EASYUI

<a href="#" class="easyui-linkbutton" data-options="width:60" data-bind="click:OnExport">全部导出</a>

通过事件触发

OnExport

看看事件的处理。

self.OnExport = function () {            var url = "/RestAPI/Business/Post?businessname=@bizId&businessaction=GetWithdrawRecord&token=@tokenId";            var form = $("<form>");   //定义一个form表单            form.attr('style', 'display:none');   //在form表单中添加查询参数            form.attr('target', '');            form.attr('method', 'POST');            form.attr('action', url);                                    var status = $('<input>');            status.attr('type', 'hidden');            status.attr('name', 'status');            status.attr('value', self.displaydata.status());            var timetype = $('<input>');            timetype.attr('type', 'hidden');            timetype.attr('name', 'timetype');            timetype.attr('value', self.displaydata.timetype());            var accountNo = $('<input>');            accountNo.attr('type', 'hidden');            accountNo.attr('name', 'accountNo');            accountNo.attr('value', self.displaydata.accountNo());            $('body').append(form);  //将表单放置在web中            form.append(status);   //将查询参数控件提交到表单上            form.append(timetype);   //将查询参数控件提交到表单上            form.append(accountNo);   //将查询参数控件提交到表单上            form.submit();           };

这种方式是通过POST方式处理，将表单掩藏。将数据通过POST提交。

这就是整个前端处理。

1 0