Js和JQuery获取鼠标指针坐标的实现代码分享

前端技术 2023/09/02 JavaScript 
<!DOCTYPE html>
<html>
<head>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=utf-8\" />
<script src=\"//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js\"></script>
<title>jquery 获取鼠标指针的坐标</title>
<script>
//普通js函数
function test(event) {
 event = event || window.event;
 var x = event.offsetX || event.layerX;
 var y = event.offsetY || event.layerY;
 alert(\"x=\"+x+\"; y=\"+y);
 }
//jquery函数
$(function(){
 $(\"#t\").mouseover(
 function(event){
  event = event || window.event; 
  var x = event.offsetX || event.originalEvent.layerX;
  var y = event.offsetY || event.originalEvent.layerY;
  alert(\"x:\"+x+\"; y:\"+y);
 }
 );
 });
</script>

</head>

<body>
<div id=\"t\" style=\"float:left;background-color: green;width: 300px;height: 60px;\">测试鼠标位置（jquery函数处理）</div>
<div id=\"s\" onmouseover=\"test(event)\" style=\"float:left;background-color: red;width: 300px;height: 60px;margin-left:10px;\">测试鼠标位置（普通js函数处理）</div>

</body>
</html>

本文地址：https://www.stayed.cn/item/3765

转载请注明出处。

本站部分内容来源于网络,如侵犯到您的权益,请 联系我

我的博客

人生若只如初见，何事秋风悲画扇。

我的标签

随笔档案