如何下载输入类型文件的内容/图像/数据? [英] How to download the content/image/data of input type file?

问题描述

我想知道如何在输入类型文件中下载数据/内容/图像

I wanna know how to download the data/content/image in an input type file

注意:不必提交.只需从按钮直接下载即可，他可以在其中下载输入类型文件的内容

Note: It doesnt have to be submitted. just a direct download from a button in which he can be able to download the content of an input type file

我该怎么做?

示例代码

$(".downloadupinvoice").click(function(){
   var file = document.getElementById('id-input-file-2').files[0];

   //Put some code here to produce a file ?
   window.location=window.URL.createObjectURL(file);
})

我似乎无法预览文件，但它没有下载，我在地址栏中注意到它显示为

i cant seem to preview the file but it is not downloading also i notice in the address bar that it display like this

blob:69c7ee1a-ba44-4234-9216-68b3c86b9c96

blob:69c7ee1a-ba44-4234-9216-68b3c86b9c96

推荐答案

最后得到了它.

$(".downloadupaddinvoice").click(function(){
        var filename = $('#id-input-file-2').val();

        if (filename == "" || filename == null) {
            alert('Error');
        }else {
            var file = document.getElementById('id-input-file-2').files[0];      
            var filename = document.getElementById('id-input-file-2').files[0].name;      
            var blob = new Blob([file]);
            var url  = URL.createObjectURL(blob);

            $(this).attr({ 'download': filename, 'href': url});  
            filename = "";
        }

    })   

这是定位标记的位置:)

This is the where the anchor tag :)

<a class="help-button col-sm-4 downloadupaddinvoice"  title="Download uploaded invoice" download><i class="icon-download-alt"></i></a>

希望这对将来有所帮助.

Hope it might help in the future..

这篇关于如何下载输入类型文件的内容/图像/数据?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！