「模板」 - 選擇

Question

另一個新手問題之間共享一些值。我有一個關於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的一個通用的辦法把設置在一個共同的地方？有點像子類。

我不感興趣，在一個循環中產生的jQuery代碼（由於）一些技術限制的任何服務器端解決方案和b）我的願望，學習jQuery）。

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

我一直在玩這個日子與qtip插件，我可以推薦你到你的工具提示的內容存儲在DOM元素的title屬性：

$("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"/>