javascript - 在鼠标悬停事件上使用 Javascript 隐藏内容

Question

通常我会使用 CSS 来控制样式，但在这种特殊情况下我不能。

我有很多onmouseover事件于 <li>标签，如下面的示例所示。

<li onmouseover="document.getElementById('vid').style.display='none'">1</li>
<li onmouseover="document.getElementById('vid').style.display='none'">2</li>
<li onmouseover="document.getElementById('vid').style.display='none'">3</li>

我想做的是而不是写 onmouseover="..."对于每个 <li>只需从 <script></script> 控制此样式事件即可元素，以便页面上的代码更少。

这可以做到吗？我不知道足够的 JavaScript 代码 <script> ???? </script>

Answer 1

使用jquery:

$(document).ready(function() {
  $('body').on('mouseover', 'li', function() {
    $("#vid").hide();
  });
});