页面加载后等待元素加载
我有一个从文件加载 SVG Dom 的函数。目前,它创建一个 embed
元素并将其放置在文档中,然后等待它通过 onload
事件加载。然而,显然,页面加载后放置在文档中的元素不会调用 onload
。有没有一种方法可以注册一个在元素加载完成后调用的函数?
这就是我所拥有的:
function loadSVG(svgFilename, callback)
{
// Loads data from an svg file
// loadSVG(
// svgFilename, // The path to the file to load
// callback // The function to be called with the
// // SVG document once it loads.
// );
var embed = document.createElement("embed");
embed.src = svgFilename;
embed.onload = function() // Doesn't get called because page has already loaded
{
var doc = embed.getSVGDocument();
document.getElementById("SVGLoader").removeChild(embed);
callback(doc);
};
document.getElementById("SVGLoader").appendChild(embed);
}
I have a function that loads a SVG Dom from a file. Currently, it creates an embed
element and places it in the document, then waits for it to load with an onload
event. Apparently, however, onload
isn't called for elements placed in the document after the page has loaded. Is there a way that I can register a function to be called after the element has finished loading?
This is what I have:
function loadSVG(svgFilename, callback)
{
// Loads data from an svg file
// loadSVG(
// svgFilename, // The path to the file to load
// callback // The function to be called with the
// // SVG document once it loads.
// );
var embed = document.createElement("embed");
embed.src = svgFilename;
embed.onload = function() // Doesn't get called because page has already loaded
{
var doc = embed.getSVGDocument();
document.getElementById("SVGLoader").removeChild(embed);
callback(doc);
};
document.getElementById("SVGLoader").appendChild(embed);
}
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
相关:如何检查嵌入的 SVG 文档是否加载到 html 页面中?
如果您可以控制 SVG 文档,您是否可以在其中添加一个调用浏览器窗口中的函数的脚本?
或者,正如该问题的答案所建议的那样,轮询以查看 SVG 文档是否已完成加载。
Relevant: How to check if an embedded SVG document is loaded in an html page?
If you have control over the SVG document, could you not add a script in it that calls a function in the browser window?
Or, as the answer to that question suggested, polling to see if the SVG document has finished loading.
我找到了问题所在,我正在将 SVG 文档加载到
div
标记中,该标记用style="display:none"
隐藏。由于某种原因,浏览器没有加载位于此标记中的embed
。当我删除 style 属性时, onload 事件按照我预期的方式触发。I figured out the problem, I was loading the SVG document in a
div
tag that was hidden withstyle="display:none"
. For some reason, the browser didn't load theembed
when it was in this tag. When I removed the style attribute, the onload event fired the way I expected it to.