Javascript，將事件綁定到div標記的問題

Question

我正嘗試將事件綁定到動態創建的div。

function GameField(playerNumber) { 
this.fields = new Array(); 
this.player = playerNumber; 
this.isPlayerActive = false; 
this.currentRound = 0; 
} 

GameField.prototype.InitField = function(fieldNumber) { 
    var newField = document.createElement("div"); 
    if (fieldNumber == 0 || fieldNumber == 6 || fieldNumber == 8 || fieldNumber == 17) 
     newField.className = 'gameCellSmall borderFull gameText gameTextAlign'; 
    else 
     newField.className = 'gameCellSmall borderWithoutTop gameText gameTextAlign'; 
    newField.onclick = function() { this.DivClick('a'); } 
    this.fields[fieldNumber] = newField; 
    return newField; 
} 

GameField.prototype.DivClick = function(fieldNumber) { 
    alert('Nummer: ' + fieldNumber); 
} 

一切完美，但是當你點擊創建的div的一個，我結束了以下錯誤信息：錯誤：對象不支持此屬性或方法。

如果我這個替換的onclick功能，那麼它的工作原理：

newField.onclick = function() { alert('Nummer: ' + fieldNumber); } 

我怎樣才能獲得onclick事件解僱我DivClick功能呢？

Answer 1

問題在於onclick事件處理程序的執行是通過指向觸發事件的DOM元素的this值執行的，所以這就是執行this.DivClick失敗的原因。

您需要強制執行的情況下，才能使用該事件處理程序中的實例方法，例如，你可以存儲對當前實例的引用：

GameField.prototype.InitField = function(fieldNumber) { 
    var newField = document.createElement("div"); 
    //... 
    var instance = this; 
    newField.onclick = function() { instance.DivClick('a'); } 
    //... 
} 

Answer 2

就是那樣

function DivClick (fieldNumber) { 
     alert('Nummer: ' + fieldNumber); 
    } 

{this.DivClick（'a'）; } - 應該被替換爲{DivClick（'a'）; }