当imgGraph的src加载了生成的dataURI时，我无法触发onLoad处理程序。 dataURI是使用canvas从d3.js可视化（svg）生成的。
var canvas = document.getElementById(visual + '-canvas'); if(visual == "graph"){ console.log('graph logic n stuff') canvas.width = 558; canvas.height = 558; var graph = d3.select('#graph-svg').node(); var svg_xml = (new XMLSerializer()).serializeToString(graph); var imgGraph = new Image(); var context = canvas.getContext('2d'); var imageData; imgGraph.onload = function(){ console.log('img loaded') context.drawImage(imgGraph, 0, 0); imageData = getImgData(canvas); console.log(imageData) def.resolve(imageData) } console.log('setting src') imgGraph.src = "data:image/svg+xml;base64,"+btoa(svg_xml); } 正在设置img src，但img.onload永远不会被触发。 登录和浏览数据库时，会显示图像。 其他图像似乎正确地触发了onload事件。
DataURI – PasteBin
不要对你的svg进行base64编码。
相反，人们应该更喜欢百分比编码版本，或者更喜欢巨大的svg，blobURI：
img.src = 'data:image/svg+xml;charset=utf8,' + encodeURIComponent(yourSVGMarkup);
要么
img.src = URL.createObjectURL( new Blob([yourSVGMarkup], { type: 'image/svg+xml;charset=utf8' }) );
JSfiddle展示了它的不同之处。
但是您应该注意，在
如果这样做，你的svg标记确实很长，对于dataURI版本来说可能太长了。
这是blobURI有用的时候。
PS：如果您需要帮助在svg中附加光栅图像，请检查此Q / A.
尝试：
imgGraph.complete = function（）{
需要了解更多jQuery教程分享在将src动态设置为dataURI时，Img.onload不会触发，都可以关注jQuery技术分享栏目—计算机技术网(www.ctvol.com)!
以上就是jQuery教程分享在将src动态设置为dataURI时，Img.onload不会触发相关内容,想了解更多jQuery开发(异常处理)及jQuery教程关注计算机技术网(www.ctvol.com)!)。
本文来自网络收集，不代表计算机技术网立场，如涉及侵权请联系管理员删除。
ctvol管理联系方式QQ:251552304
本文章地址：https://www.ctvol.com/jquerytutorial/982185.html