11

オブジェクト内の Ajax コールバックに関する問題に対処しています。このコードを検討してください:

Search.prototype =
{
    ask : function( query )
    {
        // Display loader
        $('.loader').show();

        $.ajax({
            dataType : 'jsonp',
            type : 'GET',
            url : 'http://api.deezer.com/search/track/',
            data : {
                output : 'jsonp',
                q : query
            }
        }).done(function(res) {

            this.loadResults( res );
            // [Error] Object success has no method 'loadResult'

        });
    },

    loadResults : function (res)
    {
        // Hide loader
        $('.loader').hide();

        console.log( res );

        // doing some stuff
        // ...
    }
}

var search = new Search();
search.ask( 'eminem' );

Object success has no method loadResultコールバックが匿名のjQuery関数の一部であるため、エラーが発生します。

しかし、最初のオブジェクト インスタンスを取得する方法は?

私は var that = this; を試してきました。Ajax 呼び出しの前ですが、同じ理由で機能しません。

これが可能かどうか、または問題がコードのグローバル組織に起因するかどうかはわかりません。ベストプラクティスについて気軽にアドバイスしてください:)

事前に感謝します。

【アップデート(解決済み)】

ここに投稿する必要はないと思っていたコードのいくつかを難読化しましたが、最終的にコードの少し前に問題を発見しました。申し訳ありません。

これが私の完全なコードです。これは現在機能しています:

define(['jquery'], function($) {

    var Search = function()
    {
        this._keyDownTimer = 0;
        this._searchDelay = 1000; // ms
    };

    Search.prototype =
    {
        // The init function that I though it was unnecessary to post here. Sorry :/
        init : function()
        {
            $('#q').on('keydown', (function(evt) {

                clearTimeout( this._keyDownTimer );

                this._keyDownTimer = setTimeout( (function() {

                    this.ask( $('#q').val() );

                }).bind( this ), this._searchDelay); /* <-- Here's the solution.
                                                        I forgot to bind `this`
                                                        to the timeout callback function,
                                                        so the `this` under all of my code
                                                        was referring to the anonymous function
                                                        of this callback. */

            }).bind( this ));
        },

        ask : function( query )
        {
            // Display loader
            $('.loader').show();

            console.log(this); // Now `this` refers to my object :)

            var req = $.ajax({
                dataType : 'jsonp',
                type : 'GET',
                url : 'http://api.deezer.com/search/track/',
                context : this,
                data : {
                    output : 'jsonp',
                    q : query
                }
            });

            req.done(function(res) {
                this.loadResults(res);
            });
        },

        loadResults : function (res)
        {
            // Hide loader
            $('.loader').hide();

            // doing some stuff
            // ...
        }
    };

    return new Search;

});

ご回答ありがとうございます、本当に助かりました。

鉛が解決されました。

4

3 に答える 3