說明:
- clientX和clientY屬性:事件發生時,鼠標指針在視口中的水平和垂直坐標。
- pageX和pageY屬性:鼠標光標在頁面中的位置。
- screenX和screenY屬性:鼠標事件發生時,鼠標指針相對于整個屏幕的坐標信息。
- IE8及更早的版本不支持事件對象上的頁面坐標(pageX,pageY)。
- EventUtil參考上一篇。
// 取得鼠標事件在頁面中的坐標
var div =document.getElementById("myDiv");
EventUtil.addHandler(div, "click", function(event) {event = EventUtil.getEvent(event);var pageX = event.pageX,pageY = event.pageY;if (pageX === undefined) { // 兼容IE8及以下pageX = event.clientX + (document.body.scrollLeft || document.document.scrollTop);}if (pageY === undefined) {pageY = event.clientY + (document.body.scrollTop || document.documentElement.scrollTop);}alert("Page coordinates: " + pageX + "," + pageY);
});
//取得鼠標事件的屏幕坐標
var div = document.getElementById("maDiv");
EventUtil.addHandler(div, "click", function(event){event = EventUtil.getEvent(event);alert("Screen coordinates: " + event.screenX + "," + event.screenY);
});
摘自《JavaScript高級程序設計》(第3版) P371