0
コンストラクタ関数でインスタンス化された別の関数からJavaScript変数にアクセスできません。 undefined
を返します。他の関数からのインスタンス変数へのアクセス
クラスBox
の新しいオブジェクトをインスタンス化しており、インスタンス変数を定義し、HTML要素を作成し、イベントリスナーを設定するコンストラクタ関数でインスタンス化しています。このリスナーのハンドラclickHandler
は、プロトタイプで定義されている関数です。 clickHandler
から、私はthis.selected
変数にアクセスしようとしています。しかし、私はundefined
を得ます。
コード:
HTML
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
</head>
<body>
<div id="element1"></div>
<br/>
<div id="element2"></div>
<script type="text/javascript" src="script.js"></script>
<script>
init([{id: "element1"}, {id: "element2"}]); //call init function
</script>
</body>
</html>
Javascriptを script.js私は、さまざまなイベントハンドラ関数にthis.selected
変数にアクセスするにはどうすればよい
function Box(id, count) { //the class
this.selected = false; //need this variable in clickHandler
this.div = document.createElement("div");
this.div.id = "container" + count;
this.div.style.width = "250px";
this.div.style.height = "150px";
this.div.style.border = "1px solid black";
document.getElementById(id).appendChild(this.div);
this.div.addEventListener("click", this.clickHandler, false); //add event listener on the created div element
}
Box.prototype.clickHandler = function() { //click handler
console.log("clickHandler, selected = " + this.selected); // undefined
};
function init(settings) {
//var obj;
for(var i = 0; i < settings.length; i++) {
new Box(settings[i].id, (i+1)); //instantiate new object
}
}
?私は複数のイベントを聞いて、そのために変数this.selected
が必要です。お手伝いありがとう。ハンドラを追加する
http://stackoverflow.com/questions/8100469/preserve-this-reference-in-javascript-prototype-event-handlerの可能性の重複とhttp://stackoverflow.com/questions/2025789/this-in-javascript-prototype-functionへの参照およびhttp://stackoverflow.com/questions/20279484/how-to-access-the-correct-this-inside-a -折り返し電話 – Connum