4

問題があり、何度も検索した後もまだロックされています。jQueryプラグインの作成方法に関する多くのチュートリアルに従いました(jQueryのチュートリアル「オーサリング」から始まりました。これはもう存在しませんが、次のようにプラグインを作成することをお勧めします)、プラグインの他のパブリックメソッドのアクセス設定については何も指定されていません.

コードに話させます:

;(function($, window, document, undefined) {

    var methods = {
        init: function(options) {
            return this.each(function() {
                var $this = $(this);
                $this.settings = $.extend(true, {}, $.fn.test.defaultSettings, options || {});
                console.log($this.settings);
            });
        },
        update: function() {
            return this.each(function() {
                var $this = $(this);
                console.log($this.settings);
            });
        }
    };

    $.fn.test = function(method) {
        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.inlineEdit');
        }
    };

    $.fn.test.defaultSettings = {
        'test': "ok"
    };
})(jQuery, window, document);

基本的に、私はただしようとします:

$('body').test(); // displays 'Object {test: "ok"}'
$('body').test('update'); // displays 'undefined'

では、更新機能で自分の設定にアクセスするにはどうすればよいですか?

編集: kalley のおかげで、data() を使用して設定変数を保存/取得するだけで完璧になります:

var methods = {
    init: function(options) {
        return this.each(function() {
            var $this = $(this);
            $this.settings = $.extend(true, {}, $.fn.test.defaultSettings, options || {});
            $this.data("test", $this.settings);
            $this.settings.test2 = "that rocks !";
            console.log($this.settings);
        });
    },
    update: function() {
        return this.each(function() {
            var $this = $(this);
            $this.settings = $this.data("test");
            console.log($this.settings);
        });
    }
};

そしていま:

$('body').test(); // displays 'Object {test: "ok", test2: "that rocks !"}'
$('body').test('update'); // displays 'Object {test: "ok", test2: "that rocks !"}'
4

1 に答える 1

1

initメソッドを次のように変更してみてください。

var $this = $(this);
$this.data('test', $.extend(true, {}, $.fn.test.defaultSettings, options || {}));
console.log($this.data('test'));

次に、更新で次のようにアクセスします。

 console.log($this.data('test'));

「テスト」を使用した理由は、それがプラグインの名前だからです。上書きやその他の競合が発生しないように、必要に応じて変更してください。

于 2013-07-07T01:33:35.083 に答える