如何使用jQuery獲取滑鼠指針的當前坐標:在實際應用中,可能需要獲取當前滑鼠的坐標,下麵就來簡單介紹一下如何實現此功能。當然例子非常簡單,大家可以根據實際需要靈活的應用和擴展。代碼實例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8">
如何使用jQuery獲取滑鼠指針的當前坐標:
在實際應用中,可能需要獲取當前滑鼠的坐標,下麵就來簡單介紹一下如何實現此功能。
當然例子非常簡單,大家可以根據實際需要靈活的應用和擴展。
代碼實例如下:
<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #mytest { width:150px; height:150px; background-color:green; } </style> <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#mytest").mousemove(function(e){ $("span").text("x:"+e.pageX+"y:"+e.pageY+"") }) }) </script> </head> <body> <div id="mytest"></div> <div>當前滑鼠指針坐標:<span></span></div> </body> </html>
以上代碼可以獲取當前滑鼠指針坐標,不過要註意的是,此坐標並不相對於div的,而是獲取的滑鼠指針在文檔的坐標。
相關閱讀:
(1).mousemove事件可以參閱jQuery的mousemove事件一章節。
(2). text()函數可以參閱jQuery的text()方法一章節。
(3).pageX屬性可以參閱jQuery的event.pageX屬性一章節。
原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=5811
更多內容可以參閱:http://www.softwhy.com/jquery/