如何判断鼠标是否在DIV的区域内_javascript技巧
程序员文章站
2022-04-08 20:01:33
...
今天研究了一下这个问题,也普及了一下知识吧。
function chkIn()
{
div_1.innerText = "现在你把鼠标移入层了!";
div_1.style.font = "normal black";
}
function chkOut()
{
div_1.innerText = "现在你把鼠标移出层了!";
div_1.style.font = "bold red";
}
方法二:
function checkIn(e){
var x=window.event.clientX;
var y=window.event.clientY;
var str= ' ';
for(i=0;i var obj=document.body.children[i];
if(x> obj.offsetLeft
&&x &&y> obj.offsetTop
&&y str+= ' \n ';
}else{
str+= ' \n ';
}
}
alert(str);
}
document.onclick=checkIn
方法三:
if(myDiv.contains(window.event.srcElement))
即 if(myDiv.contains(鼠标位置的元素对象))
方法一:
通过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";
}
复制代码 代码如下:
onMouseOver="chkIn()" onMouseOut="chkOut()">This is a DIV
方法二:
复制代码 代码如下:
function checkIn(e){
var x=window.event.clientX;
var y=window.event.clientY;
var str= ' ';
for(i=0;i
if(x> obj.offsetLeft
&&x &&y> obj.offsetTop
&&y str+= ' \n ';
}else{
str+= ' \n ';
}
}
alert(str);
}
document.onclick=checkIn
方法三:
这个方法是最简单的实用的。
复制代码 代码如下:
if(myDiv.contains(window.event.srcElement))
即 if(myDiv.contains(鼠标位置的元素对象))
具体情况还是要根据自己需要来选择,我是调试了一下方法三,但是具体也没使用上。 其他方法,继续研究中。
推荐阅读
-
判断某个字符在一个字符串中是否存在的js代码_javascript技巧
-
获取鼠标在div中的相对位置的实现代码_javascript技巧
-
javascript如何判断输入的url是否正确_javascript技巧
-
判断某个字符在一个字符串中是否存在的js代码_javascript技巧
-
获取鼠标在div中的相对位置的实现代码_javascript技巧
-
JS判断当前页面是否在微信浏览器打开的方法_javascript技巧
-
JS判断当前页面是否在微信浏览器打开的方法_javascript技巧
-
javascript如何判断输入的url是否正确_javascript技巧
-
多个checkbox被选中时如何判断是否有自己想要的_javascript技巧
-
JavaScript判断DIV内容是否为空的方法_javascript技巧