如何定義樣式內容的JQuery UI工具提示項選項

我正在嘗試爲頁面上的幾個單選按鈕選項創建工具提示。我已經有足夠輕鬆地顯示[title]屬性的工具提示，但我想選擇性地將工具提示文本格式化爲幾個元素。我知道我可以將內容提供爲HTML，並且我已經創建了一些類來設置內容的樣式，但現在不再顯示工具提示。我認爲我的問題是我沒有正確指定「項目」選項。事實上，我不太清楚如何定義我的HTML「內容」選項作爲一個項目。 Halp扮演！通過JS如何定義樣式內容的JQuery UI工具提示項選項

<a href="#" id="tooltip" class="link-info"></a>

感謝閱讀選擇

$('#tooltip').tooltip({ 
    tooltipClass: "tooltip-class" 
    items: what do? 
    content: "<div class="tooltip-header">header</div><div class="tooltip-description">text</div>" 
});

HTML。 :)

UPDATE：

好！我明白了......有點兒。我正在包裝不當的字符串：「<>」錯誤代碼「<>」。我對內容選項的問題的解決方案是將我的html放入一個變量中並將其設置爲內容。 JQuery似乎更喜歡這一點。我的樣式顯示正確的工具提示，但出於某種原因，它只能在爲工具提示選擇的三個項目之一上工作。控制檯中沒有任何內容表明它不應該起作用。沒有語法錯誤，我選擇了正確的ID。我很困惑。

來源

2013-03-21 Ryan Taylor

content: "<div class="tooltip-header">header</div><div class="tooltip-description">text</div>"

這產生語法錯誤。

請執行下列操作：

學習如何使用瀏覽器的JS錯誤控制檯
學習JS語法的絕對基礎知識，以及如何使用字符串/文本文字工作

來源

2013-03-21 16:23:03 CBroe

我可以不提供html作爲jquery ui工具提示的內容嗎？ – 2013-03-21 17:20:31

我想我知道你遇到了什麼。當您使用content選項時，您仍然必須在元素上包含title屬性，或者將items選項指定爲不同的內容。

我沒有想法爲什麼jQuery團隊決定這樣做，因爲它似乎selector您正在應用工具提示，將用於items選項相同的東西。相當重複。

無論如何，你可以改變內容，但要確保元素你申請一個工具提示有title屬性或您指定的items選項與選擇這可能只是你所申請的提示，以選擇匹配。確實很奇怪。

例子： $('#selector').tooltip({ content: 'your content', items: '#selector' });

來源

2013-04-02 15:09:47 CoryDorning

同意，很奇怪的實現 – 2014-11-04 22:07:15

奇怪的是，文檔只是說「如果你改變這個選項[內容]你可能還需要更改項目選項」。真的有用...... – 2014-11-21 11:14:58

當你有報價的問題，你有很多選擇，像你說：

使用另一個變量，你終於做了

難逃「內」用下面的反斜槓來表示：

$('#tooltip').tooltip({ 
    tooltipClass: "tooltip-class", 
    items: "what do?", 
    content: "<div class=\"tooltip-header\">header</div><div class=\"tooltip-description\">text</div>" 
});

集單引號和雙引號：

$('#tooltip').tooltip({ 
    tooltipClass: "tooltip-class", 
    items: "what do?", 
    content: '<div class="tooltip-header">header</div><div class="tooltip-description">text</div>' 
});

UPDATE

：如果您創建了鏈接與id和您正在使用的ID選擇將提示

<a href="#" id="tooltip" class="link-info"></a>

有在一個html頁面中只能有一個與id相同的鏈接！所以如果你宣佈更多的鏈接與相同的id，最有可能它不會工作。

來源

2013-07-09 15:50:09 betatester07

如何定義樣式內容的JQuery UI工具提示項選項

回答

相關問題