也不知道算是不算進階。。。姑且放標題來吸引眼球吧

玩過canvas的都知道canvas的事件處理僅僅依存canvas，對內(nèi)部的東西則不存在事件處理，那么我們該怎么辦呢。。。。。。呢

微信小程序也支持canvas，好多人都想用canvas來做點東西，可是搞了半天除了圖表就是圖表，要么就是畫板之類的東西，那么如何來對canvas內(nèi)部的小東西來綁定事件監(jiān)聽呢

接下來是一串代碼

    window.onload=function(){
        var canva=document.getElementById('canva');
        var ctx  =canva.getContext("2d");
        var h=canva.height;
        var w=canva.width;
        var rext={                            //隨機坐標
            x:Math.random()*(w-50),
            y:Math.random()*(h-50),
        };
        (function Rect(){                       //畫一個矩形，當然圓也可以
            ctx.fillStyle='whitesmoke';
            ctx.fillRect(rext.x,rext.y,50,50);
        })()    

------------


        接下來的可以自行封裝起來留著以后用，我只是舉個李子
        canva.addEventListener('mousemove',function(ev){   //鼠標滑過的處理
            var ev=ev||event;
            var x=ev.clientX;            
            var y=ev.clientY;                     
            //獲取鼠標的信息，或者手指的動作信息也可以
            if(x>=rext.x && x<=rext.x+50 && y>=rext.y && y<=rext.y+50  )
            {        
                        console.log('選中');            //此處可進行具體的動作處理
                }
            })        
    }

該代碼扣自我正在開發(fā)的插件中(默默的裝了一波逼)，也許你會問為什么不寫小程序版本的呢，又關(guān)這個問題嘛。。。。。。。。。。。。。。我還不會小程序呢，hhhhh
水了那么多，其實我是來掙積分的，有關(guān)移植到小程序的問題，誰有空可以來試一下.鄙人因為臨近期末的緣故，所以要開始看書了
有關(guān)小程序的canvas開發(fā)，我之前有寫過兩篇話題，canvas新手可以去參考著那兩章來嘗試這一節(jié)的內(nèi)容.不懂的歡迎提問.
此處打個廣告—-誠邀canvas開發(fā)的各位大大，有興趣的可以參與我的canvas插件的制作

樓下歡迎打賞點贊扔硬幣