私は、それを呼び出すオブジェクトに追加の機能/メソッドを提供する jQuery プラグインを作成しようとしています。私がオンラインで読んだすべてのチュートリアル (過去 2 時間閲覧) には、せいぜいオプションを追加する方法しか記載されておらず、追加機能は記載されていません。
私がやりたいことは次のとおりです:
// div のプラグインを呼び出して、div をメッセージ コンテナとしてフォーマットします
$("#mydiv").messagePlugin();
$("#mydiv").messagePlugin().saySomething("hello");
またはそれに似たもの。要するに、プラグインを呼び出し、次にそのプラグインに関連付けられた関数を呼び出します。これを行う方法が見つからないようですが、これまでに多くのプラグインがこれを実行しているのを見てきました。
プラグインに関してこれまでに作成したものは次のとおりです。
jQuery.fn.messagePlugin = function() {
return this.each(function(){
alert(this);
});
//i tried to do this, but it does not seem to work
jQuery.fn.messagePlugin.saySomething = function(message){
$(this).html(message);
}
};
どうすればそのようなことを達成できるのでしょうか?
ありがとう！
2013 年 11 月 18 日更新: 正解を Hari さんの次のコメントと賛成票の回答に変更しました。
ベストアンサー1
jQueryプラグインオーサリングページ（http://docs.jquery.com/Plugins/オーサリング)、jQuery と jQuery.fn の名前空間を混乱させないようにするのが最善です。次の方法が提案されています:
(function( $ ){
var methods = {
init : function(options) {
},
show : function( ) { },// IS
hide : function( ) { },// GOOD
update : function( content ) { }// !!!
};
$.fn.tooltip = function(methodOrOptions) {
if ( methods[methodOrOptions] ) {
return methods[ methodOrOptions ].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof methodOrOptions === 'object' || ! methodOrOptions ) {
// Default to "init"
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + methodOrOptions + ' does not exist on jQuery.tooltip' );
}
};
})( jQuery );
基本的に、関数を配列 (ラップ関数にスコープ設定) に保存し、渡されたパラメータが文字列の場合はエントリをチェックし、パラメータがオブジェクト (または null) の場合はデフォルト メソッド (ここでは "init") に戻ります。
次に、次のようにメソッドを呼び出すことができます...
$('div').tooltip(); // calls the init method
$('div').tooltip({ // calls the init method
foo : 'bar'
});
$('div').tooltip('hide'); // calls the hide method
$('div').tooltip('update', 'This is the new tooltip content!'); // calls the update method
Javascript の「arguments」変数は渡されたすべての引数の配列なので、任意の長さの関数パラメータで動作します。