Остановить мышью вниз события тела на SVG мыши вниз

Здесь я пытаюсь остановить событие нажатия мыши на теле, когда мышь выключена из SVG при срабатывании. Я также попробовал event.stopPropagation но здесь это не работает. Вот мой код

var svgElem=document.getElementById("mySVG");
svgElem.onmousedown=function(){
        event.stopPropagation();
        event.preventDefault();
        console.log("svg down");
    }
document.body.onmousedown=function(){
        console.log("body down");
}

Тело мыши внизу срабатывает после SVG мыши вниз.

Источник

2 ответа

Решение

Похоже, вы были довольно близко. Следующий пример делает то, что я думаю, что вы хотите.

function redClick(e) {
  e.preventDefault();
  e.stopPropagation();
  console.log('red clicked');
}
function bodyClick(e) {
  console.log('body clicked');
}
window.onload = function() {
 document.getElementById('noclick').addEventListener('mousedown',redClick,false);
 document.body.addEventListener('mousedown',bodyClick,false);
}
<div style="background:grey;width:100%;height:6em;">click me too.
<div id="noclick" style="color:white;width:50%;height:3em;background:red">click me :]</div>
</div>

Источник 

var svgElem=document.getElementById("mySVG");
svgElem.onmousedown=function(){
        event.stopPropagation();
        event.preventDefault();
        alert("svg down")
        console.log("svg down");
    }
document.body.onmousedown=function(){
        console.log("body down");
        alert("body down")
}
<body>
  <div id="mySVG">
    hey svg
  </div>
</body>

Приведенный выше пример работает в Chrome и не работает в Firefox.

Firefox выдает ошибку, так как не находит event параметр в svgElem.onmousedown

измените свой код, как показано ниже.

svgElem.onmousedown=function(event){
        event.stopPropagation();
        event.preventDefault();
        console.log("svg down");
    }
Источник
Другие вопросы по тегам