如何检查鼠标是否在jQuery中的元素上
答案:使用 CSS :hover
伪类
您可以简单地将 CSS :hover
伪类选择器与 jQuery mousemove()
结合使用来检查鼠标是否在 jQuery 中的元素上。
当您将鼠标指针放在或移开 DIV 元素的框时,以下示例中的 jQuery 代码将在网页上显示一条提示消息。
示例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery 检查鼠标是否在元素上</title>
<style>
div{
margin: 80px;
height: 200px;
background: orange;
}
</style>
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script>
$(document).ready(function(){
$(document).mousemove(function(){
if($("#myDiv:hover").length != 0){
$(".hint").text("Mouse is Over the DIV Element.");
} else{
$(".hint").text("Mouse is Outside the DIV Element.");
}
});
});
</script>
</head>
<body>
<div id="myDiv"></div>
<p class="hint"><!-- Hint text will be displayed here --></p>
</body>
</html>
FAQ 相关问题解答
以下是与此主题相关的更多常见问题解答: