使用jQuery

时间:2018-05-17 07:10:33

标签: javascript jquery html svg

我使用jQuery和文件标签上传svg:

HTML:

 <input type='file' />
 <img id="myImg" src="#" alt="your image" />

jQuery的:

 $(function () {
$(":file").change(function () {
    if (this.files && this.files[0]) {
        var reader = new FileReader();
        reader.onload = imageIsLoaded;
        reader.readAsDataURL(this.files[0]);
    }
});
});

         function imageIsLoaded(e) {
             $('#myImg').attr('src', e.target.result);
  };

SVG正在上传并在图片标签上显示。问题是,我需要将svg嵌入到html中,而不仅仅是将其显示为图像。任何想法如何获取svg代码并将其嵌入到html中?

1 个答案:

答案 0 :(得分:1)

我想推荐你the docs

它说你得到一个带有数据属性的base64编码字符串。因此,为了获得明文,您需要删除“data:* / *; base64”(在您的情况下可能是* / *的image / svg + xml,但您可以在开发工具中查找)开始,而不是做base64解码。之后你应该能够将svg直接放入dom。

解码:

let base64 = e.target.result.split('base64,')[1];
let clear = atob(base64);