Как вызвать функции мыши для встраивания данных? - PullRequest
Новая
       18

Как вызвать функции мыши для встраивания данных?

0 голосов
/ 08 января 2012

У меня есть несколько файлов для вставки SVG на моем сайте. Я хотел бы использовать для них функции onmouseclick, onmouseout и onmousemove, но они не работают. Возможно ли это сделать?

1 Ответ

2 голосов
/ 09 января 2012

Это возможно только в том случае, если встроенный скрипт 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>
...