0

jQuery プラグイン内の可変スコープに関する基本的なものが欠けています。以下は jQuery プラグインのスタブです (主に jQuery.com のドキュメントに基づいています)。

$test変数 (およびtest) をプラグイン内のすべての関数で使用できるようにしたいと考えています。

以下のコード例では、変数 test は期待どおりに「hello」をコンソールに書き込みます。

ただし、変数$testは jQuery() をコンソールに書き込みます。

$test質問: (a) jQuery(div#test) をコンソールに書き込まないのはなぜですか? (b) すべての関数で jQuery 変数 (またはその他の変数) を使用できるようにするためのベスト プラクティスは何ですか。たとえば、.net クラスのクラス レベル変数に似ています。

(function ($) {

var settings = {
};

var methods = {
    init: function (options) { if (options) { $.extend(settings, options); } return init(this, settings); }
};

$.fn.scopetest = function (method) {
    // Method calling logic
    if (methods[method]) {
        return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
    } else if (typeof method === 'object' || !method) {
        return methods.init.apply(this, arguments);
    } else {
        $.error('Method ' + method + ' does not exist on jQuery plugin');
    }
};

var $test = $('#test');
var test = 'hello';

var init = function (object, settings) {
    return object.each(function () {

        console.log($test);
        console.log(test);
    });
}

})(jQuery);
4

3 に答える 3

0

オプションで試してください：

(function ($) {

var options = {
        option1: "some_value",
        option2: "another_value",
        ...
    }
var settings = {
    };

関数から次のように参照します。

var self = this;
alert( self.options.option1 );

または：

var self = this,
    o = self.options;
alert( o.option1);

また、Jqueryウィジェットファクトリプラグインのレイアウトもご覧ください。これはあなたに近いものですが、私はさらに気に入っています。

(function( $, window) {

    $.widget("widge_name", $.widget, {

        options: {
        ...
        },
        init: function(param_1, param_2) {
        ...
        },
        _create: function() {
        ...
        },
        some_function_A: function(param3, param4) {
        ...
        }
        some_function_B: function(param3, param4) {
        var self = this;
        // run some_function_A 
        self.some_function_A("foo","bar");
        }
  });
}) (jQuery,this);

このようにして、上記のようにselfを使用して同じ方法で他の関数を呼び出すことができます。

于 2012-06-18T06:08:22.230 に答える
0

興味深いことに、var $test ステートメントを残して代入を init 関数に移動するとうまくいくようです。そのため、関数内でない限り $ を使用すると問題が発生するようです。より良い解決策が見つかるまで、これを回避策として使用します。

(function ($) {

var settings = {
};

var methods = {
    init: function (options) { if (options) { $.extend(settings, options); } return init(this, settings); }
};

$.fn.scopetest = function (method) {

    // Method calling logic
    if (methods[method]) {
        return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
    } else if (typeof method === 'object' || !method) {
        return methods.init.apply(this, arguments);
    } else {
        $.error('Method ' + method + ' does not exist on jQuery plugin');
    }
};

var $test;
var test;

var init = function (object, settings) {

    return object.each(function () {

        $test = $('#test');
        test = 'hello';
        testfunc();
    });
}

var testfunc = function () {
    console.log($test);
    console.log(test);
}

})(jQuery);
于 2012-06-18T14:38:01.893 に答える
0

  • $test がコンソールに jQuery(div#test) を書き込まないのはなぜですか?

    testなぜなら、 DOM には id を持つそのような要素がないからです。したがって、jQuery は空の collection を返しますjQuery()。

  • すべての関数で jQuery 変数 (またはその他の変数) を使用できるようにするためのベスト プラクティスは何ですか?

    ベストプラクティスについてはよくわかりませんが、変数をグローバルにアクセスできるようにする必要がある場合は、変数をwindowオブジェクトに関連付けます。お気に入り、

    window.$test = $('#test');
    window.test = 'Hello';

windowオブジェクト（例：）alert(window.$test);または単に変数名を使用して、それらにアクセスしますalert($test);

于 2012-06-18T06:26:45.880 に答える