dataURL不会为<a>

-2

更新工作：最后，我找出原因我自己，理由是：其实我用角的NG-HREF的同时，其前缀一个unsafe的传输数据的URL，我必须配置编译器服务放弃这样的限制：dataURL不会为<a>

.config([ 
    '$compileProvider', 
    function($compileProvider) 
    { 
     $compileProvider.aHrefSanitizationWhitelist(/^\s*(https?|ftp|mailto|chrome-extension):/); 
     // Angular before v1.2 uses $compileProvider.urlSanitizationWhitelist(...) 
    } 
])

其中约举行了会谈： Angular changes urls to "unsafe:" in extension page

全部：

我想要做的是读取图像dataURL中，并给它一个标签作为下载：

<input type='file' name='doc' /> 
<a href="#" download="data">Download</a> 
<script> 
      var fileOBJ = $("input")[0] 
         .files[0]; 
      var reader = new FileReader(); 
      reader.onload = function(e){ 
       $("a")[0].href=e.target.result; 
      } 
      reader.onerror = function(err){ 
       console.log(err); 
      } 
      reader.readAsDataURL(fileOBJ); 
</script>

下载总是失败。

但是，如果我使用<img>而不是<a>，则图像可以显示出来。我不知道什么是错的<a>链接

来源

2017-02-10 Kuan

我假设JS实际上被称为onchange的文件输入？ – epascarello

你必须指定''download'属性像这样'

@epascarello是的，我们可以，我实际上添加了另一个按钮来做同样的事情，但是，该功能被确认。 – Kuan

指定链接上的atrribute download。就像这样：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type='file' name='doc' /> 
 
<a download="filename" href="#">Download</a> 
 
<script> 
 
    $("input").change(function() { 
 
    var fileOBJ = $("input")[0] 
 
     .files[0]; 
 
    var reader = new FileReader(); 
 
    reader.onload = function(e) { 
 
     $("a")[0].href = e.target.result; 
 
     // if you want to change the download filename 
 
     // $($("a")[0]).attr("download", "some other filename"); 
 
    } 
 
    reader.onerror = function(err) { 
 
     console.log(err); 
 
    } 
 
    reader.readAsDataURL(fileOBJ); 
 
    }) 
 
</script>

来源

2017-02-10 23:29:34

也许描述了包括'更改'事件处理程序在答案，这是问题'''问题？ – guest271314

你尝试调用readAsDataURL在有选择的任何文件，是什么引发错误。选择某个文件后使用此方法。

var reader = new FileReader(); 
reader.onload = function(e){ 
    $("a")[0].href = e.target.result; 
}; 

reader.onerror = function(err){ 
    console.log(err); 
}; 

$('#inpFile').on('change',function(){ 
    reader.readAsDataURL(this.files[0]); 
});

来源

2017-02-10 23:38:07

dataURL不会为<a>

回答

相关问题