页面加载后等待元素加载

发布于 2024-09-19 06:54:11 字数 864 浏览 7 评论 0原文

我有一个从文件加载 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

方觉久 2024-09-26 06:54:53

相关:如何检查嵌入的 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.

薄荷梦 2024-09-26 06:54:45

我找到了问题所在,我正在将 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 with style="display:none". For some reason, the browser didn't load the embed when it was in this tag. When I removed the style attribute, the onload event fired the way I expected it to.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文