[Js]如何取鼠标的当前位置/坐标

授权方式:署名,非商业用途,保持一致,转载时请务必以超链接(http://www.fwolf.com/blog/post/111)的形式标明文章原始出处和作者信息及本声明。

一般在Javascript中,我们用.clientX来取当前鼠标在文档中的坐标,用.ScreenX来去当前鼠标在屏幕中的坐标。但是,在Mozilla系列浏览器中,直接使用是不行的,会提示说没有定义,因此在Mozilla或Firefox中调用时,需要变通一下。

在调用函数的时候,始终传一个参数进去,在Mozilla中,会将对象传进去,而在IE下默认就有对象,也不冲突,这个问题就解决了。

以下这个例子就能够在IE和Mozilla中都正常运行。

当前鼠标坐标为:
X:
Y:

源代码:

<pre onmousemove=”DisplayMp()” class=”code”>
当前鼠标坐标为:
X:<span id=”mp_x”></span>
Y:<span id=”mp_y”></span>
</pre>

<script type=”text/javascript”>
<!–//–><![CDATA[//>
<!--
/**
* 显示/隐藏指定的对象(style.display方式)
* @param object 事件,用于捕捉鼠标位置等,可省略
*/
function DisplayMp()
{
document.getElementById('mp_x').innerHTML = .clientX + 'px';
document.getElementById('mp_y').innerHTML = .clientY + 'px';
} // end of function DisplayMp
//--><!]]>
</script>

另外取到鼠标的坐标,赋值给style.top等属性的时候,后面需要加上单位,不然也会提示错误。下面就是一个正确的例子:

obj.style.top = .clientX + 10 + ‘px’;

See Also:

Update @ 2007-03-29
如果在中使用html_obj.onclick = function () { some_action uses }这类语法时,如果遇到,注意最好大写,不然不会生效。

Tags: , ,

Related posts

Leave a Reply

您的留言将被缓存和审阅,所以不会立即出现在这里,请别着急,着急的话可以给我发邮件 :-)
支持Markdown Extra语法,参见: [甲] [1] [2]