JQueryプラグイン開発サンプル code_jquery

JQuery プラグイン開発:
クラス レベルの開発、新しいグローバル関数の開発
オブジェクト レベルの開発、JQuery オブジェクトの新しいメソッドの開発
1. - グローバル メソッドを定義します

コードをコピーします コードは次のとおりです:

jQuery。 foo = function( ) {
alert('This is a test.');

名前空間を使用すると、名前空間内での関数の競合を回避できます。

コードをコピー コードは次のとおりです。

jQuery.apollo={
fun1 :function( ){
console.log('fun1');
fun2:function(){
console.log('fun2'); }




2. オブジェクト レベルの開発 - jQuery オブジェクト メソッドの定義

コードをコピー

コードは次のとおりです。 (function($) { $.fn.pluginName = function() {

};
})( jQuery);
//プラグインは次のように呼び出されます:
$('#myDiv').pluginName();


オプションを受け入れますプラグインの動作を制御するパラメータ

コードをコピー

コードは次のとおりです:(function($){ $.fn.fun2=function (オプション){

vardefaultOption={

param1:'param1',
param2:'param2'
}
$.extend(defaultOption,option);
console.log (defaultOption)
}
})(jQuery);
$(function(){
// のように呼び出されます) this
$("body").fun2({
param1:'new Param1'
})
});


プライベート関数を非公開にします

コードをコピー

コードは次のとおりです: (function($) { //プラグイン定義

$.fn.hilight = function(options) {

debug(this);
// ...
}; // デバッグ用のプライベート関数
/ / "debug" メソッドは外部クロージャから入ることができないため、実装では Private です。
function debug($obj) {
if (window.console && window.console.log)
window.console.log('ハイライト選択数: ' $obj.size()); > };
// ...
})(jQuery);