Question

我试图将JS处理程序添加到我的SVG的一些孩子身上。我在SVG中使用以下代码：

  <script type="text/javascript" id="script3079">
    addClickEvents();

    function addClickEvents() {
        var keys = document.getElementsByTagName('path');
        for (var i=0; i &lt; keys.length; i++){
            keys[i].addEventListener('click', keyClicked);
        }
    }

    function keyClicked(e) {
        var node = e.target;
        alert(node.id);
    }
  </script>

它工作正常。但现在我想调用EXTERNAL javascript文件中的函数：

//myfile.js
function keyClickedExternal(e) {
  alert('keyClickedExternal');
}

当然，它通过script标记附加到我的HTML。

我尝试了以下绑定：

keys[i].addEventListener('click', keyClickedExternal); //keyClickedExternal undefined
keys[i].addEventListener('click', parent.keyClickedExternal); //keyClickedExternal undefined
keys[i].addEventListener('click', top.keyClickedExternal); //keyClickedExternal undefined
keys[i].addEventListener('click', parent.keyClickedExternal); //keyClickedExternal undefined

我检查了DOM：

parent.window.document //access violation
window.document //refers to SVG document
document //the same as previous

最后，我不明白如何将外部处理程序绑定到SVG子级。

Answer 1

正如@Robert Longson所说，问题与Chrome的安全性有关 - 它将其他本地文件视为不同的域名。使用网络服务器，Luk。

Answer 2

您应该添加document.domain = 'Your_domain_name'; 在每个JavaScript文件的开头行，我还建议阅读有关从不同域名运行脚本的crossdomain.xml文件（例如：statics.yourdomain.com，包括静态css，js，img文件）

P.S：很抱歉迟到的回复，我正在寻找别的东西，看到你的问题仍然没有回复

将onclick事件的外部处理程序添加到SVG元素

2 个答案: