jQuery プラグインの作成方法をよりよく理解しようとしており、http://docs.jquery.com/Plugins/Authoringに基づいて理解しています。私は最後にいて、名前空間とデータについて混乱しています。
まず(以下のコードの QUESTION 1 を参照): チュートリアルでは、ターゲット ( $this) とツールチップの両方がオブジェクト リテラルに格納されていることが示されています。
- これらの特定の変数を保存する利点は何ですか?
- デフォルト値とカスタム オプションがあった場合、結果の設定オブジェクトを保存するのに適した場所でしょうか?
$(this).data('tooltip',{target:$this,tooltip:tooltip});また、代わりに彼らがした理由はあり$this.data('tooltip',{target:$this,tooltip:tooltip});ますか？
2 つ目(以下のコードの質問 2 を参照): チュートリアルでは、プラグインを破棄する方法を示しています。わかります$this.removeData('tooltip');が、何をするのdata.tooltip.remove();ですか？
ソース: http://docs.jquery.com/Plugins/Authoring#Data
(function( $ ){
var methods = {
init : function( options ) {
return this.each(function(){
var $this = $(this),
data = $this.data('tooltip'),
tooltip = $('<div />', {
text : $this.attr('title')
});
// If the plugin hasn't been initialized yet
if ( ! data ) {
/*
Do more setup stuff here
*/
//QUESTION 1
$(this).data('tooltip', {
target : $this,
tooltip : tooltip
});
}
});
},
destroy : function( ) {
return this.each(function(){
var $this = $(this),
data = $this.data('tooltip');
// Namespacing FTW
$(window).unbind('.tooltip');
QUESTION 2
data.tooltip.remove();
$this.removeData('tooltip');
})
},
reposition : function( ) { // ... },
show : function( ) { // ... },
hide : function( ) { // ... },
update : function( content ) { // ...}
};
$.fn.tooltip = function( method ) {
if ( methods[method] ) {
return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || ! method ) {
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist on jQuery.tooltip' );
}
};
})( jQuery );