2

このコードは機能します：

var myElement = document.getElementById("red"); 
    setInterval(function() {
        console.log("Left:" + myElement.offsetLeft + "px | Top:" + myElement.offsetTop + "px");
    }, 1000);

これは毎秒位置（x、y）を出力します

しかし、オブジェクトを使用するように変更しようとすると:

function Enemy(id){
    this.id = getElementById(id);
    this.getCoordinates = function(){
        setInterval(function() {
            console.log("Left:" + this.id.offsetLeft + "px | Top:" + this.id.offsetTop + "px");
        }, 1000);
    }
}

$(document).ready(function(){
    var enemy = new Enemy("red");
    enemy.getCoordinates();

});

何も出力されません。間違いがどこにあるかわかりません。

4

4 に答える 4

4

setIntervalor setTimeout(または onclick などのイベント ハンドラ) では、変数thisはグローバル オブジェクトを参照します。ブラウザでwindow.

最新のブラウザーでは、次のことができます。

setInterval((function() {
        console.log("Left:" + that.id.offsetLeft + "px");
    }).bind(this), 1000); // <------- bind

それ以外の場合、他のすべてのソリューションは基本的に最初のコード片と似ています。

bind()古いブラウザーに移植できる Mozillaの in pure js の実装があることに注意してください。MDN で検索してください。

于 2013-09-05T20:38:42.720 に答える
2

問題は、「this」の値が setInterval 内で変化していることです。修正は、次のように変更することです。

function Enemy(id){
  this.id = document.getElementById(id);

  var self = this;
  this.getCoordinates = function(){
    setInterval(function() {
        console.log("Left:" + self.id.offsetLeft + "px | Top:" + self.id.offsetTop + "px");
    }, 1000);
  }
}
于 2013-09-05T20:39:48.747 に答える
1 
function Enemy(id){
    this.id = document.getElementById(id);
    this.getCoordinates = function(){
        var element = this.id;
        setInterval(function() {
            console.log("Left:" + element.offsetLeft + "px | Top:" + element.offsetTop + "px");
        }, 1000);
    }
}

$(document).ready(function(){
    var enemy = new Enemy("red");
    enemy.getCoordinates();

});
于 2013-09-05T20:41:03.917 に答える
0

slebetman が言ったように、「this」変数はあなたが期待したものではありません。さまざまなスコープでアクセスできる「その」変数に保存してみてください。

function Enemy(id){
    var that = this; // reference to 'this' that can be used in other scopes
    that.id = document.getElementById(id);
    that.getCoordinates = function(){
        setInterval(function() {
            console.log("Left:" + that.id.offsetLeft + "px | Top:" + that.id.offsetTop + "px");
        }, 1000);
    }
    return that;
}
于 2013-09-05T20:40:38.427 に答える