jQueryの世界で最も単純なプラグインの作り方サンプル

jQueryの世界で最も単純なプラグインの作り方サンプル

jQueryは要素セレクターやクロスブラウザ対応が優れたjavascriptのライブラリで、prototype.jsと並んで広く使われています。そのjQueryでは、独自に自前の関数をプラグインという形で作ることができます。jQueryプラグインの作り方は検索すれば山ほど出てきますが、その第一歩となるプラグインの基本的な書き方が見つからなかったので記事にしておこうと思います。

次のプラグインは、単に文字色を赤くするだけのものです。mypluginがプラグイン名です。$(this).css('color', 'red');の部分以外がプラグインの骨組みとなり、この部分だけ差し替えれば、全く別のプラグインを作ることができます。

(function($){
	$.fn.myplugin = function() {
		return this.each(function() {
			$(this).css('color', 'red');
		});
	};
})(jQuery);

このプラグインの動作デモ

コメント&トラバ

トラックバックを送る

無関係なスパムのトラックバックを防止するため、リンク先で本サイト(suin.asia)への言及が確認されないトラックバックは破棄しています。

トラバURL : http://suin.asia/trackback/323

コメントを書く

トラックバック

トラックバックがないのはさみしいにゃん…。

コメントはないです。誰かコメント書いてよぅ…。

このブログの著者

Suinと申します。

サブメニュー

最近気になるモノ！

WindowsからMacに乗り換えて半年ですが、Macは細かいところまで丁寧に作られていて、親切なユーザーインターフェイスが気に入ってます。iMacはMagic Mouseと洗練されたデザインのBluetoothキーボードがついてくるので、お得だなあ、なんて思ってます。私に買ってもいいという方、いたら教えてください笑。

XOOPS Cube Dev Ring

氷川 XOOPS Module 開発室

[XCL22] jQuery UI Default CSS (03/09)
[XCL22] RSS AutoDiscovery (03/09)
[XCL22] CSS class/id の定義とテンプレートの標準化 (03/09)
[XCL22] 速度改善 (03/07)
[XCL22] meta要素設定 (03/07)
[module] XCCK 日付項目改善など (03/04)
[module] Xq テンプレート改善など (03/04)
[一般] PHPのデザインパタン (03/02)

最近のトラックバック

http://www15.atpages.jp/~classicalstudio/wordpress/?p=50: getcwd()とdirname(__FILE__)は違う結果になるときがある (12/22)
Re:: CSSのtext-align:center;は<div>には通用しない (12/15)
XOOPS専門-株式会社RYUS - d3blog: Shiori 1.02 (12/02)
9deMaio.com - blog: Koins 1.00 (11/11)
インターネット覚え書き「ビボウログ」: CSSのtext-align:center;は<div>には通用しない (09/16)
hinoeuma1966: CSSのtext-align:center;は<div>には通用しない (07/03)
Suin.org: ブログ作ってみた (03/23)
Suin.org: ブログ作ってみた (03/23)

お名前*		URL
本文*
合い言葉*	←「15seatioght」と入力して下さい。

メインメニュー