Question

我正在尝试在javascript中创建一个具有动画运行的对象，该对象在完成后调用另一个方法。

function panel_manager() {
    this.animating = false;

    this.doAnimate = function (nPanel) {
        //if we're still moving panels, do nothing
        if(this.animating) return;

        this.animating = true;

        //enlarge new panel
        $("#panel" + this.focusedPanel).animate({width:"115px"},1000, this.endAnim);
    }

    this.endAnim = function () { alert("called"); this.animating = false; }
}

为了简洁起见，已经删除了很多内容，当代码不在对象内部并使用全局变量时，此代码可以正常工作。警报运行，但动画不会改变。

Answer 1

变量。

function panel_manager() {
    var that = this;
    this.animating = false;
    this.doAnimate = function (nPanel) {
        if(this.animating) return;
        this.animating = true;
        $("#panel" + this.focusedPanel).animate({width:"115px"},1000, that.endAnim);
    }
    this.endAnim = function () { alert("called"); that.animating = false; }
}

Answer 2

在this.doAnimate内添加$ .proxy。

var callback = $.proxy( this.endAnim, this );

$("#panel" + this.focusedPanel).animate({width:"115px"},1000, callback);

基本上问题是，当您将其分配给这样的回调时，会丢失this值。 proxy将确保使用正确的this调用函数。

干杯！

Javascript对象访问它的属性

2 个答案: