0

我一直在尝试通过 javascript 访问 SVG 图像的一部分。外部文件（同域）中的图像由外部 js 文件（同域）操作。

像这样的例子：

<html>
<head>
    <title>My Title</title>
    <meta charset="utf-8">
    <script defer="defer" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script defer="defer" src="controls.js" type="text/javascript"></script>
</head>
<body>
    <img id="spikeroad" src="map.svg" alt="loadbarspike"/>
</body>

我之前问过这个问题：可以getElementByID decend into SVG docs吗？

我已经阅读并考虑了此处看到的其他人的反馈：如何使用 Javascript 访问 SVG 元素，包括所有额外的答案，但我似乎无法让它工作。

涉及事件时是黑匣子吗？我需要使用吗？（至少对我而言）有一些关于此的错误信息。但是，我的代码对任何一个都不起作用。

我的主要症结似乎（对我来说）是让“加载”事件触发。

这是我的最新版本：

$(document).ready(function() {
    'use strict';
    $(window).on("load", function () {
        var svgContainer = document.getElementById("spikeroad");
        var svgDoc = svgContainer.contentDocument;
        var inner = svgDoc.getElementById("innerrect");
        inner.addEventListener("mousedown", function() {
            console.debug('inner box was clicked');
        }, false);
    }, false);
});

任何更多的反馈将不胜感激。

4

1 回答 1

1

你不能得到contentDocument一个img元素的。如果您改用它，它应该可以工作iframe。

于 2013-06-10T08:45:24.260 回答