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 - Socket.io - 套接字拆分成房间

jquery - mask 图像以使其成为像双目一样的 View

html - 如何制作 .svg 文件以填充其 <div> 容器的 100% 宽度?

javascript - IOS 应用程序 webview SVG ClipPath 问题

javascript - 在浏览器中生成图形图表的最佳方法是什么?

javascript - 像素范围

javascript - 自定义图 block 图像名称的反转Y轴

javascript - PHP是否等效于JavaScript“this”关键字,特别是在对象内部?

html - 在 CSS 中用 1 个 div 重叠圆圈

javascript - 动态添加时 Svg 模式不重复