jQuery mousemove 事件
當滑鼠指標在元素內移動時,mousemove事件就會被觸發。
任何HTML元素都可以接受此事件。
語法結構一:
[JavaScript] 純文字檢視 複製程式碼.mousemove(handler(eventObject))
引數解析:
(1).handler:事件處理函式;eventObject是傳遞給事件處理函式的時間物件。
jQuery1.0版本新增。
語法機構二:
[JavaScript] 純文字檢視 複製程式碼.mousemove([eventData ], handler(eventObject))
引數解析:
(1).eventData:可選,當一個事件被觸發時,要傳遞給event.data的資料。
(2).handler:事件處理函式;eventObject是傳遞給事件處理函式的時間物件。
jQuery1.4.3版本新增。
語法結構三:
[JavaScript] 純文字檢視 複製程式碼.mousemove()
引數解析:
不傳遞引數,呼叫此方法會執行事件處理函式。
jQuery1.0版本新增。
程式碼例項:
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #ant { width:150px; height:150px; background-color:green; } </style> <script src="https://code.jquery.com/jquery-3.1.1.js"></script> <script type="text/javascript"> $(document).ready(function(){ $("#ant").mousemove(function (e) { $("span").text("x:"+e.pageX+"y:"+e.pageY) }) }) </script> </head> <body> <div id="ant"></div> <div> 滑鼠指標座標:<span></span> </div> </body> </html>
滑鼠在div中移動可以獲取當前滑鼠指標的座標。
[HTML] 純文字檢視 複製程式碼執行程式碼<!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <style type="text/css"> #ant { width:150px; height:150px; background-color:green; } </style> <script src="https://code.jquery.com/jquery-3.1.1.js"></script> <script type="text/javascript"> $(document).ready(function () { var infor = { position: "滑鼠指標座標:" } $("#ant").mousemove(function (e) { $("span").text(e.data.position+"x:"+e.pageX+"y:"+e.pageY) }) }) </script> </head> <body> <div id="ant"></div> <div> <span></span> </div> </body> </html>
相關文章
- JavaScript mousemove 事件JavaScript事件
- Vue中使用MouseMove事件 獲取滑鼠座標頻率降低或事件卡頓Vue事件
- jquery事件jQuery事件
- jQuery 事件jQuery事件
- jQuery 事件方法jQuery事件
- jQuery 事件冒泡jQuery事件
- jQuery hover事件jQuery事件
- jQuery事件物件jQuery事件物件
- jQuery mouseup事件jQuery事件
- jQuery mousedown事件jQuery事件
- jQuery mouseout 事件jQuery事件
- jQuery mouseover事件jQuery事件
- jQuery mouseenter事件jQuery事件
- jQuery dblclick事件jQuery事件
- jQuery click事件jQuery事件
- jQuery submit事件jQueryMIT事件
- jQuery change事件jQuery事件
- jQuery focusout事件jQuery事件
- jQuery focusin事件jQuery事件
- jQuery blur事件jQuery事件
- jQuery focus事件jQuery事件
- jQuery scroll事件jQuery事件
- jQuery resize事件jQuery事件
- jQuery error事件jQueryError事件
- jQuery----事件jQuery事件
- jQuery 事件(二) 表單事件jQuery事件
- 36. jQuery 事件jQuery事件
- jQuery事件監聽jQuery事件
- jQuery 事件委託jQuery事件
- jQuery contextmenu事件jQueryContext事件
- jQuery mouseleave事件jQuery事件
- jQuery keyup事件jQuery事件
- jQuery keypress事件jQuery事件
- jQuery keydown事件jQuery事件
- jQuery select事件jQuery事件
- jQuery ready事件jQuery事件
- jQuery paste事件用法jQueryAST事件
- jquery DOM&事件jQuery事件