1

ポップアップを表示し、しばらくすると非表示にする次のコードがあります。

div.stop()
  .animate({top:'0px'},{queue:true,duration:this._speed})
  .animate({opacity: 1.0}, {queue:true,duration:this._delay})
  .animate({top:'-' + outer + 'px'},{queue:true,duration:this._speed,complete:this._myFunction});

アニメーションが完了すると、関数_myFunctionが正しく起動しますが、プロパティを表示できません。

_showingというプロパティをfalseに設定したいと思います。

これは私のコントロールのためのいくつかのより説明的なコードです：

MyCompany.WebNotify.prototype =
{

    initialize : function()
    {
        // Call the base initialize method
        MyCompany.WebNotify.callBaseMethod(this, 'initialize');
    },

    dispose : function()
    {

        // Clear the custom handlers
        $clearHandlers(this.get_element());

        // Call the base class method
        MyCompany.WebNotify.callBaseMethod(this, 'dispose');

    },

    // Set/set the visible property
    get_showing : function()
    {
        return this._showing;
    },
    set_showing : function(value)
    {
        var e = Function._validateParams(arguments, [{name: 'value', type: Boolean}]);
        if (e) throw e;
        if (this._showing != value)
        {
            this._updateShowing(value);
            this.raisePropertyChanged('showing');
        }
    },


    _updateShowing : function(value)
    {

        // Store the current value
        this._showing = value;

        var div = this._getMe();
        var outer =  parseInt(div.outerHeight());        
        if (value)
        {
            div.css("top", '-' + outer + 'px');
            div.css("visibility","visible");

            // If the delay is greater than 0, show, delay and then hide the notifier
            if (this._delay > 0)
            {           
                div.stop()
                .animate({top:'0px'},{queue:true,duration:this._speed})
                .animate({opacity: 1.0}, {queue:true,duration:this._delay})
                .animate({top:'-' + outer + 'px'},{queue:true,duration:this._speed,complete:this._myFunction});
            }
            else
            {
                // Show the notifier and leave it displayed
                div.stop().animate({top:'0px'},{queue:true,duration:this._speed});
            }

        }
        else if (!this._notifyFirstRun)
        {
            // Hides the notifier
            div.stop().animate({top:'-' + outer + 'px'},{queue:true,duration:this._speed});
        }

        this._notifyFirstRun = false;

    },

    _myFunction : function()
    {
        this._showing = false;  // This isn't visibile, neither is get_showing, set_showing, or any functions
                // All I see is the standard jQuery methods and properties.
    },

    _getMe : function()
    {
        return $("#" + this.get_id());
    }

}

.animateイベントの完了後に_showingプロパティを更新するにはどうすればよいですか？

4

1 に答える 1

2

何が起こっているのかというと、コールバック関数が別のスコープを使用して呼び出されていることですthis（確かではありませんが、アニメーション化されたDOMオブジェクトを取得すると思います）-これを回避するためのいくつかのテクニックがあります。

        if (this._delay > 0)
        {           

            // save a copy of "this"
            var myself = this;

            div.stop()
            .animate({top:'0px'},{queue:true,duration:this._speed})
            .animate({opacity: 1.0}, {queue:true,duration:this._delay})
            .animate({top:'-' + outer + 'px'},
              {
               queue:true,
               duration:this._speed,
               // create a quick anonymous function to call myself._myFunction()
               complete:function() { myself._myFunction(); }

               // alternative to do it all in one line:
               complete:(function(myself) { 
                 return function() { myself._myFunction(); };
               })(this); // calls the function immediately - returning an anonymous
                         // function that can carry "this" through as "myself"
              });
        }
于 2009-08-19T10:34:58.460 に答える