Question

我尝试添加 onload 回调，但不会触发 Firefox ：

const useTAG = document.getElementsByTagName("use")[0];
useTAG.onload = () => {alert('something')}
useTAG.addEventListener('load', ()=>{ alert('something') })

还有其他选择吗？但是没有抓住 href 并进行另一次 ajax 调用。

更新

显然这可能是一个有角度的问题：

我的模板中有这段代码

<svg onload="alert('ok')" ><use href="/assets/icons/alert.svg#alert"></use></svg>

onload方法不会在Firefox中触发。

更新＃2

我发现当像这样动态添加svg时：

let svg = document.createElement( "svg");

let use = document.createElementNS("http://www.w3.org/2000/svg", "use");
use.setAttribute("href", "/assets/icons/alert.svg#alert");

svg.appendChild(use);
document.body.appendChild(svg);

use.onload = () => {
  console.log("load");
};

Firefox 不会启动加载事件。

尽管使用innerHTML：

documet.body.innerHTML = '<svg onload="alert()"><use href="/assets/icons/alert.svg#alert'></use></svg>";

在某些时候，这就是角度通过模板创建节点的方式。

更新＃3：解决方案

document.body.innerHTML = "<svg id='test' onload='this.onHackLoad()'><use href='/assets/icons/alert.svg#alert'></use></svg>";
        document.getElementById("test").onHackLoad = () => {
            alert("loaded")
        };

在Firefox（angular 4 app）

0 个答案: