Canvas事件处理、Canvas元素的鼠标点击事件处理、实现一个元素管

//图片按钮var MikuImgBtn = function(x,y,w,h){this.x = x;this.y = y;this.w = w;this.h = h;this.image;this.beClick;this.createPath = function(context){context.beginPath();context.rect(this.x,this.y,this.w,this.h);context.closePath();};this.drawSelf = function(context){//图片按钮if(this.image !== undefined){context.drawImage(this.image,this.x,this.y,this.w,this.h);}};this.addBeClick= function(beClick){this.beClick = beClick;}};//存储管理已经绘制的元素的一个类//存储的元素必须实现//1.创建自身路径：createPath(context);//2.绘制自身：drawSelf(context);//3.点击时的时间处理：beClick();var MikuDrawedObjList = function (){var objList = [];this.push = function (obj){objList.push(obj);}this.remove = function(obj){for(var i = 0;i<objList.length;i++){var temp = objList[i];if(temp === obj){objList.splice(i,1);return i;}}}this.getClickObj = function (context,x,y){for(var i = 0; i<objList.length; i++){//obj必须实现这个方法objList[i].createPath(context);if(context.isPointInPath(x,y)){return objList[i];}}}this.drawAll = function (context){objList.forEach(function(obj){//obj必须实现这个方法obj.drawSelf(context);});}}//页面元素列表        var activeObjList = new MikuDrawedObjList();////按键监听//////////////////////////////////////////////////////////////////////            window.onclick = function(e){            var loc = windowToCanvas(e.clientX,e.clientY);            var clickObj = activeObjList.getClickObj(context,loc.x,loc.y);            if(clickObj!== undefined){                clickObj.beClick();            }        }

，生活的最大悲剧不是失败，而是一个人已经习惯于失败。