Javascript 更改innerHTML onmousemove事件

我想用onmousemove事件更改div的innerHTML

假设当鼠标移动到div上时，innerHTML将变为“mouse is Moving”。当鼠标停止移动时，它将返回默认的innerHTML值：“鼠标未移动”

很简单。我知道有一个onmouseleave事件可以用来撤销onmouseCenter或onmouseover操作，但没有“onmousecalm”事件可以撤销onmousemove

---

如何实现这一点？

您可以使用

mousemove

设置

innerHTML

，每次事件触发时，获取时间戳，然后使用带有某种阈值的

setInterval

来检测鼠标何时停止移动以重置

innerHTML

var div=document.querySelector（'div'），
move=div.getAttribute（'data-move'），
pause=div.innerHTML，
阈值=500；
div.addEventListener（'mousemove'，function（）{
lastMoved=新日期（）.getTime（）；
div.innerHTML=移动；
var timeout=setTimeout（函数（）{
var nowTime=new Date（）.getTime（）；
如果（nowTime-lastMoved>阈值）{
div.innerHTML=暂停；
}
}，阈值）
});
div{
填充物：5em；
边框：1px纯黑；
}
鼠标未移动
请发布您的代码