编程 Javascript

js与jquery中获取当前鼠标的x、y坐标位置的代码

Posted in Javascript onMay 23, 2011

<div id="testDiv">放在我上面</div> 
<script type="text/javascript"> 
$('#testDiv').mousemove(function(e) { 
var xx = e.originalEvent.x || e.originalEvent.layerX || 0; 
var yy = e.originalEvent.y || e.originalEvent.layerY || 0; 
$(this).text(xx + '---' + yy); 
}); 
</script>

javascript获取鼠标当前位置坐标
鼠标滑动显示鼠标的当前位置坐标，主要是onmousemove函数。

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>javascript获得鼠标位置</title> 
</head> 
<body> 
<script> 
function mouseMove(ev) 
{ 
Ev= ev || window.event; 
var mousePos = mouseCoords(ev); 
document.getElementById("xxx").value = mousePos.x; 
document.getElementById("yyy").value = mousePos.y; 
} 
function mouseCoords(ev) 
{ 
if(ev.pageX || ev.pageY){ 
return {x:ev.pageX, y:ev.pageY}; 
} 
return{ 
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft, 
y:ev.clientY + document.body.scrollTop - document.body.clientTop 
}; 
} 
document.onmousemove = mouseMove; 
</script> 
鼠标X轴: 
<input id=xxx type=text> 
鼠标Y轴: 
<input id=yyy type=text> 
</body>

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Javascript优化技巧（文件瘦身篇）

Jan 28 Javascript

jquery导航制件jquery鼠标经过变色效果示例

Dec 05 Javascript

jQuery功能函数详解

Feb 01 Javascript

JavaScript中常用的验证reg

Oct 13 Javascript

jquery Banner轮播选项卡

Dec 26 Javascript

微信小程序实现上传图片功能

May 28 Javascript

vue中锚点的三种方法

Jul 06 Javascript

值得收藏的八个常用的js正则表达式

Oct 19 Javascript

基于jQuery实现可编辑的表格

Dec 11 jQuery

JS数组及对象遍历方法代码汇总

Jun 16 Javascript

微信小程序自定义modal弹窗组件的方法详解

Dec 20 Javascript

使用Vue.js和MJML创建响应式电子邮件

Mar 23 Vue.js

在Javascript里访问SharePoint列表数据的实现方法

May 22 #Javascript

SharePoint 客户端对象模型 (一) ECMA Script

May 22 #Javascript

JQuery里选择超链接的实现代码

May 22 #Javascript

改善用户体验的五款jQuery插件分享

May 22 #Javascript

JS 进度条效果实现代码整理

May 21 #Javascript

jquery 使用点滴函数代码

May 20 #Javascript

JQuery对checkbox操作（循环获取）

May 20 #Javascript