Как обработать клик правой кнопкой мыши по svg?

Есть svg прямоугольник:
<svg version="1.1" 
		viewBox="0 0 200 100" 
		preserveAspectRatio="xMidYMid meet" 
		xmlns:xlink="http://www.w3.org/1999/xlink" 
		xmlns:ev="http://www.w3.org/2001/xml-events" 
		xmlns="http://www.w3.org/2000/svg">
	
		<rect id="rect1" class="rct" x="10" y="10" width="80" height="80" rx="20" ry="20" fill="red"   />
</svg>


в html встраиваю так:

<object id="svg" type="image/svg+xml" data="rectangle.svg" width = "200" height = "200"></object>


Подскажите, как правильно обработать клик правой кнопкой мыши по этому прямоугольнику?
  • Вопрос задан
  • 752 просмотра
Решения вопроса 1
Попробуйте так
document.getElementById('svg').onload = function() {
  var svgDoc = this.contentDocument,
    rect = svgDoc.getElementById('rect1');

  rect.addEventListener('contextmenu', function(e) {
    e.preventDefault();
    alert('На меня тычат правой кнопкой мыши!');
  });
};
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы