canvas.addEventListener()

對 canvas 元素的事件監聽用addEventListener()實現，

但是有一點缺陷是：canvas 不支持鍵盤事件，為了解決這個問題，可以采用以下兩種方案：

 

方案一： key event ---- use window as object

　　通過window對象實現對canvas事件的監聽和處理

　　window.addEventListener('keydown', doKeyDown, true);

注：擴大的事件觸發的執行對象，可以通過取 canvas 元素的第一級父元素取代 window 對象

 

方案二：key event ----- use DOM element as object

　　通過在 canvas 元素上添加其它支持鍵盤事件的DOM元素屬性，實現鍵盤事件支持，如使用 H5 的標簽屬性 tabindex

　　<canvas id='canvas' width='300' height='300' tabindex='-1'></canvas>

　　canvas.addEventListener('keydown', doKeyDown, true);

注：幾乎所有瀏覽器均支持tabindex，除了 Safari，此為方案二的不足之處