Question

如何判断鼠标在DIV的区域内?

Answer 1

今天研究了一下这个问题，也普及了一下知识吧。 方法一：通过mouseover，mouseout来触发事件，才判断鼠标是否在该区域。 但是这种方法的局限性就是，必须要触发mouseover，或mouseout，mouseleave事件才能知道。 function chkIn(){div_1.innerText = 现在你把鼠标移入层了！; div_1.style.font = normal black;}function chkOut(){div_1.innerText = 现在你把鼠标移出层了！; div_1.style.font = bold red;}<div id=div_1 style=background-color:lightblue; width:400px; height:300px; onMouseOver=chkIn() onMouseOut=chkOut()This is a DIV</div方法二：function checkIn(e){ var x=window.event.clientX; var y=window.event.clientY; var str= ' '; for(i=0;i <document.body.children.length;i++){ var obj=document.body.children[i]; if(x obj.offsetLeft &&x <(obj.offsetLeft+obj.clientWidth) &&y obj.offsetTop &&y <(obj.offsetTop+obj.clientHeight)){ str+= ' <鼠标位于层 '+obj.id+ '范围之内 \n ';}else{str+= ' <鼠标位于层 '+obj.id+ '范围之外 \n ';}}alert(str);}document.onclick=checkIn方法三：这个方法是最简单的实用的。 if(myDiv.contains(window.event.srcElement)) 即 if(myDiv.contains(鼠标位置的元素对象)) 具体情况还是要根据自己需要来选择，我是调试了一下方法三，但是具体也没使用上。 其他方法，继续研究中。