手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >如何判断鼠标是否在DIV的区域内
如何判断鼠标是否在DIV的区域内
摘要:今天研究了一下这个问题,也普及了一下知识吧。方法一:通过mouseover,mouseout来触发事件,才判断鼠标是否在该区域。但是这种方法...

今天研究了一下这个问题,也普及了一下知识吧。

方法一:

通过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"

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(鼠标位置的元素对象))

具体情况还是要根据自己需要来选择,我是调试了一下方法三,但是具体也没使用上。 其他方法,继续研究中。

【如何判断鼠标是否在DIV的区域内】相关文章:

jquery合并表格中相同文本的相邻单元格

判断file框选择的是否为图片

jquery实现的判断倒计时是否结束代码

JavaScript判断数组是否包含指定元素的方法

JavaScript判断图片是否已经加载完毕的方法汇总

JS函数实现鼠标指向图片后显示大图代码

如何实现浏览器上的右键菜单

如何取得中文输入的真实长度?

JavaScript检测鼠标移动方向的方法

如何用JS取得网址中的文件名

精品推荐
分类导航