如何取得鼠标在网页上的位置

最近做个小东西需要得到页面上鼠标的位置。

原来的代码如下：

        function getCoords(e) {
            var offsetLeft = svg.offsetLeft;
            var offsetTop = svg.offsetTop;
            return (e.clientX - offsetLeft) + ',' + (e.clientY - offsetTop);
        }

如果页面没有滚动条的时候一切正常，但是出现滚动条并且拉动滚动条之后，就出现了问题。

原来clientX得到的鼠标位置是相对于浏览器的，如果要得到当前鼠标相对于整个页面的位置需要另一个属性：pageX。

正确的代码如下：

        function getCoords(e) {
            var offsetLeft = svg.offsetLeft;
            var offsetTop = svg.offsetTop;
            return (e.pageX - offsetLeft) + ',' + (e.pageY - offsetTop);
        }

参考文章：

http://www.bennadel.com/blog/1869-jQuery-Mouse-Events-PageX-Y-vs-ClientX-Y.htm