0

私が持っているのは正しいコードのように感じますが、明らかにここで何かが欠けています。

私がやろうとしているのは、コンストラクターのプロトタイプオブジェクトにイベントメソッドを作成することです。これが私がこれまでに持っているものです：

function Controls(but) {
    this.but = document.getElementById(but);
    this.but.onclick = function() {
        displayMessageTwo();
    }
}

Controls.prototype.displayMessageTwo = function() {
    alert("HELLO");
}

var Main = new Controls('testingTwo');

ここでの私の論理は、何かのコントロールを構築するためのコンストラクターを作成しているということです（たとえば、スライドショー）。 this.butコンストラクターに引数として渡されるものと呼ばれるリンクのhtml要素に等しい。

プロトタイプオブジェクトでは、メソッドを定義してからオブジェクトを作成します。しかし、これは私が期待したようには機能していません。

私はここで何が間違っているのですか？

4

3 に答える 3

2

イベントハンドラーが起動したとき、呼び出しのコンテキストは、コールバックを登録したインスタンスではないようです。

次のようなものを試してください

function Controls(but) {
    var that = this;
    this.but = document.getElementById(but);
    this.but.onclick = function() {
        that.displayMessageTwo(); // that is closed-in
    }
}
于 2012-12-06T16:59:46.123 に答える
2

私はここで何が間違っているのですか？

displayMessageTwo();グローバル関数であるかのように呼び出しています。そうではなく、インスタンスの継承されたプロパティです。通常、thisキーワードを使用してインスタンスを参照しますが、イベントハンドラー内では参照できません。オブジェクトを参照する変数を作成し、次のようにそのメソッドを呼び出します。

function Controls(but) {
    this.but = document.getElementById(but);

    var that = this;
    this.but.onclick = function() {
        that.displayMessageTwo();
    }
}

displayMessageTwoメソッドはそのコンテキストを気にしないため（を介して他のプロパティを参照しない）this、直接割り当てることもできます。

    this.but.onclick = this.displayMessageTwo;

ただし、これは避けることをお勧めします。メソッドは常に正しいthisValueで実行する必要があります。あなたも使うかもしれませんbind：

    this.but.onclick = this.displayMessageTwo.bind(this);

ただし、サポートされていない古いブラウザには追加のコードが必要です。

于 2012-12-06T17:01:27.447 に答える
0

私は思うだろう：

function Controls(but) {
    this.but = document.getElementById(but);
    this.but.onclick = this.displayMessageTwo;
}

Controls.prototype.displayMessageTwo = function() {
    alert("HELLO");
}

var Main = new Controls('testingTwo');

より明確です（prototype.displayMessageTwoに割り当てられた関数を割り当てます）。これが機能しない場合は、

 this.but.onclick = this.displayMessageTwo;

前に評価されます：

 Controls.prototype.displayMessageTwo = function() {

それをnullにする...

于 2012-12-06T17:01:20.157 に答える