鼠标事件获取鼠标坐标

最新推荐文章于 2025-03-21 14:01:03 发布

jlhaoran

最新推荐文章于 2025-03-21 14:01:03 发布

阅读量1w

点赞数 1

分类专栏： HTML

本文链接：https://blog.youkuaiyun.com/haoranli/article/details/73176260

版权

HTML 专栏收录该内容

29 篇文章

订阅专栏

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
	<title>基本选择器</title>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
   <meta name="author" content="" />
   <meta name="keywords" content="" />
   <meta name="description" content="" />
   <style type="text/css">

     #d1{
     background-color: black;
     height: 300px;
     color: white;
     cursor: crosshair;	
     }
   </style>
   <script type="text/javascript">
      function fn(e){
      	var x = e.clientX;
      	var y = e.clientY;
      	var obj = document.getElementById("d1");
      	obj.innerHTML = x+","+y;

      }
   </script>
</head>
<body>
 <div>
  <div id="d1"  οnmοusemοve="fn(event)">
  	 这是汉字
  	 <p>这是段落</p>
  </div>
  </div>
</body>
</html>

鼠标事件：

onclick：点击事件
onmouseover:鼠标放上
onmouseout：鼠标离开
ondbclick:双击

onmousedown: 鼠标按下
onmouseup: 鼠标抬起
onmousemove: 鼠标移动。

键盘事件
       OnkeyDown：键盘按下
       OnkeyUp:键盘抬起
       OnkeyPress：按键一次
表单事件
       Onsubmit：表单提交事件
       Onreset：重置事件
       Onfocus：获得焦点
       Onblur：失去焦点
窗口事件
      1)Onload，在网页一打开的时候发生（注意：必须是把所有东西都加载完成之后）
      <body οnlοad=”init()”>
      </body>
2)window.οnlοad=init注意：函数名init之后没有括号
Event:是指之事件发生的时候（事件源）相关的一些信息
   clientX:获得鼠标的X坐标
   clientY:获得鼠标的Y坐标
event.target:事件源