jQueryの "Templating" - セレクタ間でいくつかの値を共有する

Question

もう1つの初心者質問です。私はcreating a tooltip on focusについて質問しました。解決策は、このような何かに私をリード：それは動作しますが

$("input[id$=tbMyTextbox]").qtip({ 
    content: 'Test', 
    position: { 
     corner: { 
      target: 'rightMiddle', 
      tooltip: 'leftMiddle' 
     } 
    }, 
    show: { 
     when: { 
      event: 'focus' 
     } 
    }, 
    hide: { 
     when: { 
      event: 'blur' 
     } 
    } 
}); 

、私は多くのツールチップを実装する必要があり、他のすべてが同じである一方で、それぞれの時間は、私は、セレクタおよびコンテンツ属性を変更する必要があります。

設定を共通の場所に置くjQueryには一般的な方法がありますか？サブクラス化のようなもの。

私は、（a）いくつかの技術的な制限のためにjQueryコードを生成するサーバー側のソリューションに興味はありませんし、b）jQueryを学びたいという希望です。私は、Qティップのプラグインで、この日プレーしてきた、と私はDOM要素のtitle属性であなたのツールチップのコンテンツを保存するためにあなたをお勧めすることができます

Answer 1

var defaultStyle = { 
    content: 'Test', 
    position: { 
       corner: { 
          target: 'rightMiddle', 
          tooltip: 'leftMiddle' 
         } 
       }, 
    show: { when: { event: 'focus' } }, 
    hide: { when: { event: 'blur' } } 
} 

//extend method will 'merge' defaultStyle with the second object that you have supplied, overriding properties in defaultStyle object if it exists in the second object. 

//myTextBoxStyle will have target as 'leftMiddle' and everything else from the default Style. 
var myTextBoxStyle = $.extend(defaultStyle, { position : { corner { target : 'leftMiddle' } } }); 

$("input[id$=tbMyTextbox]").qtip(myTextBoxStyle); 

Answer 2

：

$("input[title]").qtip({ // All input elements that have a title attribute 
    content: { 
     text: false // Use each elements title attribute 
    }, 
    position: { 
     corner: { 
      target: 'rightMiddle', 
      tooltip: 'leftMiddle' 
     } 
    }, 
    show: { 
     when: { 
      event: 'focus' 
     } 
    }, 
    hide: { 
     when: { 
      event: 'blur' 
     } 
    } 
}); 

... 


<input type="text" title="My Tooltip"/> 
<input type="checkbox" title="Another Tooltip"/>