У меня есть некоторые встроенные svg-файлы на моем сайте. Я хотел бы использовать onmouseclick, onmouseout и onmousemove функции на них, но они не работают. Можно ли это сделать?Как вызвать функции мыши для встраивания данных?
Это возможно только в том случае, если встроенный SVG-скрипт обслуживается из того же домена. После того, как встроенный контент завершит загрузку, вы хотите получить фактический документ svg с помощью getSVGDocument. Оттуда вы добавляете события. Проверьте это демо:
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>
сделали вы пытались что-нибудь? вставьте код здесь –
Я дал wmode = "transparent" для встраивания и функцию mouseclick для родительского div, но он не работает –