强制使用 jquery 下载所有 <a> 标签上的文件

Forcing to download files on all <a> tags using jquery

本文关键字：标签 文件 jquery 下载      更新时间：2023-09-26

我正在对数字内容实施结帐流程。当用户下订单时，我会向他展示他购买的所有产品以及产品旁边的每个产品的下载链接。我的客户希望在加载成功页面时，所有产品都应自动下载。

以下是代码片段：

包含产品下载链接的页面的 HTML 代码段

<p>Some digital product name</p>
<a class='digital-download' href="<?php echo Yii::app()->request->getBaseUrl('true'); ?>/site/downloadfile/filename/<?php echo $digital_download['filename']; ?>">Click here download</a>

我的 PHP 代码用于启动文件下载的操作(下载文件操作(：

public function actionDownloadFile($filename) {
    $file = Yii::app()->request->getBaseUrl(true) . '/upload/digitaluploads/' . $filename; //file location
    header('Content-Type: application/octet-stream');
    header('Content-Disposition: attachment; filename="' . basename($file) . '"');
    readfile($file);
}

现在，由于我的客户端希望在加载页面时自动下载所有文件，因此我尝试使用jQuery执行以下操作：

$(document).ready(function() {    
    $('.digital-download').each(function() {
        var download_link = $(this).attr("href");
        window.location = download_link;
    });
});

问题：

它仅启动第一个文件的下载，不启动其他文件的下载。此外，以下jQuery事件根本不起作用：

$(document).ready(function() {
    $('.digital-download').each(function() {
        $(this).click();
    });
});

有什么解决办法吗？

你不能使用单个窗口(window.location(来做到这一点 - 因为浏览器限制每个窗口一个页面加载。下载在页面加载时启动 - 当内容类型不可接受或打算下载时。

在我看来，最好的解决方法是使用iframes 

$('a.digital-download').each(function(){
    $('<iframe></iframe>', {src: $(this).attr('href')})
        .css({
            width:0,
            height:0,
            border:'none'
        })
        .appendTo('body');
});

下载链接是从锚元素收集的，并添加到新创建的iframe元素中。 Iframes本质上是嵌入式窗口。稍后，当iframes追加到页面时 - 启动多个页面加载并启动多个下载。

编辑：最近不得不使这个解决方案与纯JavaScript一起工作

var body = document.getElementsByTagName('body'),
    elements = document.getElementsByClassName('digital-download'),
    element, src;
for(var I in elements)
{
    if(elements.hasOwnProperty(I) && elements[I].attributes.length > 0)
    {
        src = null;
        for(var O in elements[I].attributes)
        {
            if(elements[I].attributes.hasOwnProperty(O) && elements[I].attributes[O].name == 'href')
            {
                src = elements[I].attributes[O].value;
            }
        }
        if(typeof src != 'undefined' && null !== src)
        {
            element = document.createElement('iframe');
            element.style.width = 0;
            element.style.height = 0;
            element.style.borderWidth = 0;
            body[0].appendChild(element);
            element.src = src;
        }
    }
}
相关文章：