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

コメントを書く

トラックバック

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

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

Author

Suin

Follow Twitter

Submenu

XOOPS Cube Dev Ring

氷川 XOOPS Module 開発室

Recent Trackbacks

CreaMo!: MAMPをパスワード無しで起動・終了する方法 (06/04)
YONEZO-NET: Smarty2.0からSmarty3.0への変更点 (03/28)
1-byte.jp: もっとより良いPHPerになるためのTips (03/28)
浜村拓夫の世界: さくらVPS+CentOS：SSHの設定 (02/22)
Ubuntu日記: CSS3で何の変哲もない画像をiPhone,iOS風のアイコンに変身させる (02/08)
ひとりで喜ぶログ: デュラララに登場するチャットを再現した (04/09)
ひとりで喜ぶログ: デュラララに登場するチャットを再現した (03/28)
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)

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

メインメニュー

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

付帯情報

ラベル

コメント&トラバ

トラックバックを送る

コメントを書く

トラックバック

コメント

Author

Submenu

Recent Entries

XOOPS Cube Dev Ring

Recent Comments

Recent Trackbacks

facebookいいね