JavaScript实现捕获鼠标坐标

 更新时间:2020年04月12日 11:51:44   作者:TomHe789  
这篇文章主要为大家详细介绍了JavaScript实现捕获鼠标坐标,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了JavaScript实现捕获鼠标坐标的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>事件对象</title>
 <style>
  .box1{
   width: 300px;
   height: 100px;
   border: 1px solid #000;
  }
  .box2 {
   width: 150px;
   height: 50px;
   border: 1px solid #000;
   margin-top: 50px;
   padding-top: 10px;
   box-sizing: border-box;
   text-align: center;
  }
 </style>
 <script>
  window.onload = function () {
   var box1 = document.getElementsByTagName("div")[0];
   var box2 = document.getElementsByTagName("div")[1];
   box1.onmousemove = function (event) {
    // 解决IE的兼容性问题
    event = event || window.event;
    box2.innerHTML = "X:" + event.clientX + " Y: " + event.clientY;
   }
  };
 </script>
</head>
<body>
 <div class="box1"></div>
 <div class="box2"></div>
</body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

相关文章

  • JavaScript生成二维码图片小结

    JavaScript生成二维码图片小结

    现如今,二维码无处不在,扫一扫送抽纸,那么基于js二维码是如何生成的呢?面对这一问题,下面小编给分享一代码介绍javascript生成二维码图片小结,感兴趣的朋友一起学习吧
    2015-12-12
  • JavaScript常用脚本汇总(三)

    JavaScript常用脚本汇总(三)

    本文给大家分享的常用脚本有通过数组,拓展字符串拼接容易导致性能的问题、页面 视口 滚动条的位置的辅助函数、调节元素透明度的函数、获取鼠标位置的几个通用的函数、使用cssdisplay属性来切换元素可见性的一组函数、样式相关的通用函数、获取元素当前的高度和宽度。
    2015-03-03
  • 捕获关闭窗口的脚本

    捕获关闭窗口的脚本

    对于需要获取一个窗口关闭后的返回信息时,需要用的到。
    2009-01-01
  • 教你用几十行js实现很炫的canvas交互特效

    教你用几十行js实现很炫的canvas交互特效

    HTML5中的大部分动画都是通过Canvas实现,因为Canvas就像一块画布,我们可以通过调用脚本在Canvas上绘制任意形状,甚至是制作动画,这篇文章主要给大家介绍了关于用几十行js实现很炫的canvas交互特效的相关资料,需要的朋友可以参考下
    2021-11-11
  • 小程序实现录音上传功能

    小程序实现录音上传功能

    这篇文章主要为大家详细介绍了小程序实现录音上传功能,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2019-11-11
  • javascript正则表达式使用replace()替换手机号的方法

    javascript正则表达式使用replace()替换手机号的方法

    这篇文章主要介绍了javascript正则表达式使用replace()替换手机号的方法,可实现把手机号第4位到第7位替换成****的功能,是非常实用的技巧,需要的朋友可以参考下
    2015-01-01
  • javascript 判断一个对象为数组的方法

    javascript 判断一个对象为数组的方法

    这篇文章主要介绍了javascript 判断一个对象为数组的方法的相关资料,需要的朋友可以参考下
    2017-05-05
  • javascript 获取元素样式必杀技

    javascript 获取元素样式必杀技

    这篇文章主要介绍了javascript 获取元素样式必杀技,需要的朋友可以参考下
    2014-05-05
  • 基于JS实现快速读取TXT文件

    基于JS实现快速读取TXT文件

    这篇文章主要介绍了基于JS实现快速读取TXT文件,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2020-08-08
  • Express无法通过req.body获取请求传递的数据解决方法

    Express无法通过req.body获取请求传递的数据解决方法

    这篇文章主要为大家介绍了Express无法通过req.body获取请求传递的数据解决方法详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-12-12

最新评论