HTML代码：
[code="HTML"]
<!Doctype html>
[/code]
下面是utils.js代码：
[code="javascript"]
var captureMouse=function(ele){
var mouse={x:0,y:0};
ele.onmousemove=function(event){
event=event || window.event;
if(event.pageX || wvwnt.pageY){
x=event.pageX;
y=event.pageY;
}else{
x=event.clientX+document.body.scrollLeft+document.documentElement.scrollLeft;
y=event.clientY+document.body.scrollTop+document.documentElement.scrollTop;
}
x-=ele.offsetLeft;
y-=ele.offsetTop;
mouse.x=x;
mouse.y=y;
};
return mouse;
}
[/code]
问题出现在captureMouse这个函数的返回值上面（captureMouse函数是一个求鼠标相对当前元素坐标的求法函数）。
captureMouse在html页面onload后会执行一次，然后为ele元素绑定了鼠标移动事件，同时会将当前鼠标相对于ele元素的坐标返回，html页面接受变量为mouse1。
但是大家想一下，接下来的鼠标移动只是响应了鼠标移动的事件，但是html页面并没有在鼠标移动的同时调用captureMouse，所以mouse1这个对象应该是一个不变的值，但是当我点击ele元素时发现坐标是变的，这是为什么呢？鼠标按下输入控制台的是mouse1对象的x的值，求大神指点迷津。
ele.onmousemove=function(event){
event=event || window.event;
传入这个参数是canvas，你这行代码给它添加了监听鼠标滑过的监听，只要鼠标在canvas上移动，就会触发事件，上面的代码和下面的是等效的。
[code="java"]
var captureMouse=function(ele){
var mouse={x:0,y:0};
ele.onmousemove=function(event){
event=event || window.event;
if(event.pageX || event.pageY){
x=event.pageX;
y=event.pageY;
}else{
x=event.clientX+document.body.scrollLeft+document.documentElement.scrollLeft;
y=event.clientY+document.body.scrollTop+document.documentElement.scrollTop;
}
x-=ele.offsetLeft;
y-=ele.offsetTop;
mouse.x=x;
mouse.y=y;
};
ele.onmousedown=function(){
console.log("x:"+mouse.x);
}
return mouse;
}
window.onload=function(){
var can=document.getElementById('canvas');
var mouse1=captureMouse(can);
}
[/code]
问题在 var captureMouse=function(ele){
var mouse={x:0,y:0};
ele.onmousemove=function(event){ ，
其中
ele.onmousemove=function(event)
这里已经给ele添加了function,当然会自动执行这个函数