jQuery pluginの書き方
(function($) {
//このPluginの名前
var name_space = 'basePlugin';
$.fn[name_space] = function(options) {
//いったん退避
var elements = this;
//設定情報の構築
var settings = $.extend({
//optionの初期値を設定
'param' : 'value'
}, options);
//内部用method
var inner_method = function () {
//内部の共通処理の記述
};
//要素を一個ずつ処理
elements.each(function() {
$(this)
//イベント等の設定
.keyup(inner_method)
;
});
//method chain
return this;
};
})(jQuery);
注意点としてはこんな感じです。
- window.$に依存しない （$.noConflict()時にも動くように）
- 最後はreturn this; （method chainが切れるので）
- 複数要素が指定されている場合を考慮する （Plugin内のthisは.eachで処理する）
- 名前空間を汚染しない （無名関数に閉じているのでPlugin自体の変数も外部から見えない）
(出典: tech.kayac.com)
