jquery判斷鼠標是否在元素上的方法:使用mouseover方法實現(xiàn)判斷鼠標是否在元素上;通過mouseout方法實現(xiàn)判斷鼠標是否在元素上。
當(dāng)鼠標指針位于元素上方時,會發(fā)生 mouseover 事件,當(dāng)鼠標指針從元素上移開時,發(fā)生 mouseout 事件。
和 mouseenter/mouseleave 事件不同,不論鼠標指針進入/離開被選元素還是任何子元素,都會觸發(fā) mouseover/mouseout 事件。只有在鼠標指針進入/離開被選元素時,才會觸發(fā) mouseenter/mouseleave 事件。
缺點:在頁面初始化時,也就是剛打開頁面時,是判斷不出來的,只有把鼠標移上div上一次,激活了mouseover事件后,才能判斷,具體可以看上面給的那個在線實例演示。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery判斷鼠標是否位于元素上</title>
<meta name=viewport content=width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0>
<script src="http://www.suneven.com/template/API/jc/jquery-3.5.1.min.js"></script>
</head>
<body>
<div id="mouseDiv" style="width:300px;height:300px;background:red;">
<p id="tipText"></p>
</div>
<script type="text/javascript">
$("#mouseDiv").mouseover(function(){
$("#tipText").html("鼠標在該元素上");
}).mouseout(function(){
$("#tipText").html("鼠標不在該元素上");
});
</script>
</body>
</html>mouseover() 方法
當(dāng)鼠標指針位于元素上方時,會發(fā)生 mouseover 事件。mouseover() 方法觸發(fā) mouseover 事件,或添加當(dāng)發(fā)生 mouseover 事件時運行的函數(shù)。
mouseout() 方法
當(dāng)鼠標指針離開被選元素時,會發(fā)生 mouseout 事件。mouseout() 方法觸發(fā) mouseout 事件,或添加當(dāng)發(fā)生 mouseout 事件時運行的函數(shù)。