图像转换为Base64

Question

用户选择后，我想在 base64中 获取图像（提交表单之前）

就像是 ：

$(input).on('change',function(){
  var data = $(this).val().base64file(); // it is not a plugin is just an example
  alert(data);
});

我了解了文件API和其他内容，我想要一个简单的跨浏览器解决方案（显然不包括IE6 / IE7）

任何帮助表示感谢。

Answer 1

function readFile() {

  if (this.files && this.files[0]) {



    var FR= new FileReader();



    FR.addEventListener("load", function(e) {

      document.getElementById("img").src       = e.target.result;

      document.getElementById("b64").innerHTML = e.target.result;

    });



    FR.readAsDataURL( this.files[0] );

  }



}



document.getElementById("inp").addEventListener("change", readFile);


<input id="inp" type='file'>

<p id="b64"></p>

<img id="img" height="150">

（ PS： 一个base64编码的图像（字符串）为原始图像数据大小的4/3）