 
<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獲取鼠標(biāo)當(dāng)前位置坐標(biāo)
鼠標(biāo)滑動(dòng)顯示鼠標(biāo)的當(dāng)前位置坐標(biāo)，主要是onmousemove函數(shù)。

復(fù)制代碼代碼如下:

 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>javascript獲得鼠標(biāo)位置</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> 
鼠標(biāo)X軸: 
<input id=xxx type=text> 
鼠標(biāo)Y軸: 
<input id=yyy type=text> 
</body> 

您可能感興趣的文章:

相關(guān)文章

基于jQuery實(shí)現(xiàn)的查看全文功能【實(shí)用】
本文分享了利用jQuery實(shí)現(xiàn)的查看全文功能：文本內(nèi)容少于四行，不顯示查看全文；超過(guò)五行時(shí)才顯示出來(lái)并有此功能；很實(shí)用，下面就跟小編一起來(lái)看看吧
2016-12-12
JQuery解析XML數(shù)據(jù)的幾個(gè)簡(jiǎn)單實(shí)例
下面小編就為大家?guī)?lái)一篇JQuery解析XML數(shù)據(jù)的幾個(gè)簡(jiǎn)單實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-05-05
jQuery學(xué)習(xí)筆記之jQuery+CSS3的瀏覽器兼容性
這篇文章主要介紹了jQuery學(xué)習(xí)筆記之jQuery+CSS3的瀏覽器兼容性的相關(guān)資料,需要的朋友可以參考下
2015-01-01
jQuery 選擇同時(shí)包含兩個(gè)class的元素的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇jQuery 選擇同時(shí)包含兩個(gè)class的元素的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-06-06
jquery刷新頁(yè)面的實(shí)現(xiàn)代碼（局部及全頁(yè)面刷新）
jquery刷新頁(yè)面的實(shí)現(xiàn)代碼（局部及全頁(yè)面刷新），需要的朋友可以參考下。
2011-07-07
JQuery each打印JS對(duì)象的方法
一個(gè)簡(jiǎn)單的JQuery each示例，使用each可以輸出JS對(duì)象、json格式的數(shù)據(jù)，大家參考使用吧
2013-11-11
jQuery實(shí)現(xiàn)仿美橙互聯(lián)兩級(jí)導(dǎo)航菜單效果完整實(shí)例
這篇文章主要介紹了jQuery實(shí)現(xiàn)仿美橙互聯(lián)兩級(jí)導(dǎo)航菜單效果,以完整實(shí)例形式分析了jQuery響應(yīng)鼠標(biāo)事件實(shí)現(xiàn)針對(duì)頁(yè)面元素的遍歷及樣式的動(dòng)態(tài)操作技巧,需要的朋友可以參考下
2015-09-09
jquery輪播圖插件使用方法詳解
這篇文章主要為大家詳細(xì)介紹了jquery輪播圖插件的使用方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-07-07
jQuery 如何給Carousel插件添加新的功能
本文給大家介紹如何給Carousel插件添加新的功能，非常方便以后的程序開(kāi)發(fā)，具有參考借鑒價(jià)值，感興趣的朋友一起學(xué)習(xí)吧
2016-04-04
EasyUi tabs的高度與寬度根據(jù)IE窗口的變化自適應(yīng)代碼
EasyUi tabs的高度與寬度根據(jù)IE窗口的變化自適應(yīng)代碼,需要的朋友可以參考下。
2010-10-10