如何在嵌入數據上調用鼠標功能？

我的網站上有一些嵌入svg文件。我想對他們使用onmouseclick，onmouseout和onmousemove函數，但它們不起作用。可以做到嗎？如何在嵌入數據上調用鼠標功能？

2012-01-08 Danny Fox

沒有你嘗試過什麼嗎？在這裏粘貼一些代碼 – 2012-01-08 18:23:49

我給嵌入的wmode =「transparent」，並且向父div的mouseclick函數，但它不起作用 – 2012-01-08 18:37:16

只有嵌入的SVG腳本是從同一個域提供服務的。嵌入式內容加載完成後，您需要使用getSVGDocument來獲得實際的svg文檔。從那裏你添加事件。看看這個演示：

rect.svg

<svg xmlns="http://www.w3.org/2000/svg" 
    version="1.1" 
    width="300" 
    height="200"> 
    <rect x="50" y="25" width="200" height="150" fill="red"/> 
</svg>

eventsDemo.js

var log, emb, svgDoc, rect; 

log = function (e) { 
    console.log(e.type); 
}; 

emb = document.querySelector('embed'); 

emb.addEventListener('load', function() { 
    svgDoc = emb.getSVGDocument(); 
    rect = svgDoc.querySelector('rect'); 

    rect.addEventListener('click',  log); 
    rect.addEventListener('mousemove', log); 
    rect.addEventListener('mouseout', log); 
});

demo.html

<!doctype html> 
<html> 
<head> 
</head> 
<body> 
    <embed type='image/svg+xml' src='rect.svg'> 
    <script src='eventsDemo.js'></script> 
</body> 
</html>

來源

2012-01-09 01:43:42 bennedich

如何在嵌入數據上調用鼠標功能？

回答

相關問題