如何使用 Internet Explorer 的 javascript 获取鼠标指针位置?
Posted
技术标签:
【中文标题】如何使用 Internet Explorer 的 javascript 获取鼠标指针位置?【英文标题】:How to get mouse pointer position using javascript for internet explorer? 【发布时间】:2012-06-30 00:01:55 【问题描述】:我正在开发一个网页,我在其中动态设置了<div>
中的图像。
它在 Firefox 中有效,但在 IE 中失败。
问题是:如何在IE中获取鼠标指针位置? 我正在使用以下代码获取鼠标指针位置
function getCursorXY(e)
CurX = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
CurY = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
在 Firefox 上运行良好。
【问题讨论】:
这与Java 没有有关。我会为您删除java
标记,但有待修改。
试试这个expsharing.blogspot.in/2008/08/…
【参考方案1】:
试试这个,这应该适用于包括 IE 在内的所有浏览器。
<html>
<body>
<form name="Show">
<input type="text" name="MouseX" value="0" size="4"> X<br>
<input type="text" name="MouseY" value="0" size="4"> Y<br>
</form>
<script language="javascript1.2">
<!--
// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false
// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)
// Set-up to use getMouseXY function onMouseMove
document.onmousemove = getMouseXY;
// Temporary variables to hold mouse x-y pos.s
var tempX = 0
var tempY = 0
// Main function to retrieve mouse x-y pos.s
function getMouseXY(e)
if (IE) // grab the x-y pos.s if browser is IE
tempX = event.clientX + document.body.scrollLeft
tempY = event.clientY + document.body.scrollTop
else // grab the x-y pos.s if browser is NS
tempX = e.pageX
tempY = e.pageY
// catch possible negative values in NS4
if (tempX < 0)tempX = 0
if (tempY < 0)tempY = 0
// show the position values in the form named Show
// in the text fields named MouseX and MouseY
document.Show.MouseX.value = tempX
document.Show.MouseY.value = tempY
return true
//-->
</script>
</body>
</html>
【讨论】:
为什么要使用三元运算符来检测document.all?为什么不使用 !!document.all?【参考方案2】:使用 jQuery 并使用 event.pageX 和 event.pageY!
见http://api.jquery.com/event.pageY/
【讨论】:
【参考方案3】:我用这段代码解决了这个问题
var CurX;
var CurY;
var IE = document.all?true:false;
if(IE)
CurX = window.event.clientX;
CurY = window.event.clientY;
else
if (window.captureEvents)
document.captureEvents(Event.MOUSEMOVE);
document.onmousemove = getCursorXY;
function getCursorXY(e)
CurX = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
CurY = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
【讨论】:
为什么不将 IE var 更改为 notIE,因为 if(IE) 语句将在除 IE 之外的所有设备上运行。【参考方案4】:使用:clientX 和 clientY
喜欢这段代码:
var posx = 0;
var posy = 0;
if (e.pageX || e.pageY)
posx = e.pageX;
posy = e.pageY;
else if (e.clientX || e.clientY)
posx = e.clientX + document.body.scrollLeft
+ document.documentElement.scrollLeft;
posy = e.clientY + document.body.scrollTop
+ document.documentElement.scrollTop;
【讨论】:
以上是关于如何使用 Internet Explorer 的 javascript 获取鼠标指针位置?的主要内容,如果未能解决你的问题,请参考以下文章
如何在 Internet Explorer 上使用边框半径 CSS
如何使用 Internet Explorer 使 div 居中?
如何使用 IE (Internet Explorer 11) 更改默认下载目录