post方式实现下载文件、打开新页面（ie8可用）

最新推荐文章于 2024-03-18 11:29:10 发布

原创最新推荐文章于 2024-03-18 11:29:10 发布 · 1.9k 阅读

3 ·

CC 4.0 BY-SA版权

文章标签：

#js #post下载 #jquery #下载文件

JavaScript 专栏收录该内容

11 篇文章

订阅专栏

为解决IE8环境下带有参数的a标签点击一次下载两次的问题，本文介绍了一种使用POST方式提交下载请求的方法。通过创建隐藏的iframe和form元素，附加必要的参数，确保在IE8上也能正确下载文件。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

post方式实现下载文件、打开新页面（ie8可用）

** 项目迁移到了云环境，带有参数的a标签，点击一次下载有时会下载两个文件。所以改为post方式提交下载需要的参数**
代码中append()方法行顺序不要改变，会影响ie8不生效

var DownLoadFile = function (options) {
    var config ={ method: 'post' };
    var $iframe = $('<iframe id="down-file-iframe" />');
    var $form = $('<form target="down-file-iframe" method="' + config.method + '" />');
    $(document.body).append($iframe);
    $iframe.append($form);
    $form.attr('action', options.url);
    for (var key in options.data) {
        $form.append('<input type="hidden" name="' + key + '" value="' + options.data[key] + '" />');
    }
    $form[0].submit();
    $iframe.remove();
};
//调用方法实现下载。
DownLoadFile({
            url:BASE_URL + 'Download/testDownLoad',
            data:Exceldata
        })

上面js会打开一个新窗口/页面，下载文件或者展示内容。