Question

我无法触发svg元素的事件。我在这里有以下jsfiddle：https://jsfiddle.net/r1ahq5sa/

html。

<div class="row">
  <div class="col-md-8">
    <svg class="video-nav-bar-container">
      <rect id="nav-bar" class="video-nav-bar" rx="20" ry="20"/>
    </svg>
  </div>
</div>

脚本部分。

    var navBar = document.getElementById('nav-bar');

    navBar.addEventListener('moveover', function() {
      alert('It works!');
    });

我无法将鼠标悬停事件触发并感觉像一个完整的菜鸟。任何提示将不胜感激。

Answer 1

事件名称错误，应该是'mouseover'。

navBar.addEventListener('mouseover', function() {
      alert('It works!');
});

Answer 2

检查完小提琴后，我发现您使用moveover Jquery事件而不是Javascript。使用mouseover它会起作用。

试试这个

navBar.addEventListener('mouseover', function() {
      alert('It works!');
})

无法将鼠标悬停事件侦听器添加到SVG元素

2 个答案: