JS中的鼠标移入移除监控操作
有些时候我们需要通过页面来监控用户的行为，包括鼠标操作键盘操作，本文章介绍的是鼠标的操作监控：
<script>
window.onload = function(){
var oDiv = document.getElementById("myDiv");
//拖拽
oDiv.onmousedown = function(ev){
var ev = ev || window.event;
var disX = ev.clientX - this.offsetLeft;
var disY = ev.clientY - this.offsetTop;
this.style.background = "#09C";
document.onmousemove = function (ev){
var ev = ev || window.event;
oDiv.style.background = "#0C9";
oDiv.style.left = (ev.clientX - disX) + 'px';
oDiv.style.top = (ev.clientY - disY) + 'px';
};
document.onmouseup = function (){
document.onmousemove = null;
document.onmouseup = null;
oDiv.style.background = "#337ab7";
};
return false;
}
//鼠标移入移出监测
var oDiv2 = document.getElementById("myDiv2");
oDiv2.onmouseover = function(){
this.style.backgroundColor = "#337ab7";
this.innerHTML = "鼠标已移入";
}
oDiv2.onmouseout = function(){
this.style.backgroundColor = "#5bc0de";
this.innerHTML = "鼠标移入移出事件监测";
}
}
</script>
通过onmouse系列事件函数来检测鼠标的行为，在页面可视范围内的操作都可被监控到。
<body>
<div id="myDiv">拖动我</div>
<div id="myDiv2">鼠标移入移出事件监测</div>
</body>
