javascript - svg onload 函数什么时候发生

标签 javascript svg

鉴于此:

<?xml version="1.0" standalone="yes"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" 
  "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="100px" height="100px" version="1.1"
 xmlns="http://www.w3.org/2000/svg"
>
<text 
 x="20" 
 y="20" 
 onload="alert('load'); setAttribute('fill', 'fuchsia')"
 onclick="setAttribute('fill', 'lightgreen')"
 onmouseout="setAttribute('fill', 'black')"
>Load me</text>
</svg>

我希望在打开 svg 时看到粉红色的文本。 onclick 和 onmouseout 按预期工作。

这在 Firefox 中不会发生。 IE 无法打开它,期间。

有什么解释吗?

最佳答案

使用 onload事件 <svg>元素。这适用于所有浏览器。

<?xml version="1.0" encoding="ISO-8859-1" standalone="no"?>
<svg onload="init(evt)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:gui="http://www.kevlindev.com/gui">
    <script>var info,infoElem;

    function init(e) {
        if ( window.svgDocument == null )
            svgDocument = e.target.ownerDocument;

        infoElem = svgDocument.getElementById("info");
        infoElem.setAttributeNS(null,"fill", "fuchsia");
    }

    function changeColor(c){
        infoElem.setAttributeNS(null,"fill", c);
    }</script>
    <text id="info" x="20"  y="20" onclick="changeColor('lightgreen')" onmouseout="changeColor('black')">Load me</text>
</svg>

关于javascript - svg onload 函数什么时候发生,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7917408/

相关文章:

javascript - 如何在 Meteor.js 中使用 SOAP?

javascript - 路径以及 x 和 y 轴未附加到 d3.js 中的 g 标记

html - 为什么不能将 datauri img 复制到剪贴板?

javascript - 阿宝 : convert svg to png

javascript - 拉斐尔JS : How can I change the path attribute?

html - 将 CSS 中的 SVG 调整为过去 100%

javascript - dropDatabase 后不强制执行唯一字段约束

javascript - jQuery : Passing Variable Value From On Click Event Failed

javascript - Jinja 如何在复选框被选中时获取

javascript - 如何将 Dialogflow v2 与 javascript 前端 (Vue.js) 集成