未触发Onmousedown JavaScript

Question

我尝试使用以下代码将悬停类添加到html元素中：

.block {
  height: 50px;
  width: 200px;
  background: yellow;
}

.shadow {
  box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="block"
     onmouseover="$(this).addClass('shadow');"
     onmousedown="$(this).toggleClass('shadow');"></div>

该类将在鼠标悬停时添加，但不会在mousedown时删除。
为什么？

Answer 1

您的代码正确。检查此链接：

https://www.w3schools.com/code/tryit.asp?filename=FWXV3Y8JXYTI

注意：onmosedown表示何时按下鼠标按钮！它不同于mouseout。