當鼠標懸停在元素上時使用jQuery更改標題屬性

我有div按鈕，它具有我們用作使用jQueryUI的工具提示的文本的標題屬性。我想通過點擊來改變按鈕的工具提示。但是，單擊按鈕並觸發回調函數時，鼠標位於div上，標題爲空。當鼠標懸停在元素上時使用jQuery更改標題屬性

我該如何解決這個問題？它看起來像jQueryUI Tooltip小部件刪除懸停的標題，並將其放回鼠標。

$(document).tooltip(); 
$(".btn").click(function(){ 
    alert($(this).attr("title")); // Expect to see T1 or T2 but shows blank 
    if ($(this).attr("title")=="T1"){ 
     $(this).attr("title","T2") 
    }else{ 
     $(this).attr("title","T1") 
    } 
});

直播：http://jsfiddle.net/lordloh/ckTjA/

不到位jQueryUI的工具提示部件，事情似乎很好地工作：http://jsfiddle.net/lordloh/ckTjA/1/

而且，我已經申請上$(document)的工具提示部件。所以我不能使用$(this).tooltip("option","content")，因爲工具提示並未明確應用於$(this)。這會導致控制檯出現Javascript錯誤。

2013-02-18：截至目前，我正在運行$(document).tooltip("destroy");，更改標題屬性和$(document).tooltip();。沒有:-(我在尋找的東西一個優雅的解決方案，是不是黑客攻擊

來源

2013-02-17 Lord Loh.

小部件刪除文本從title屬性，以防止本機瀏覽器工具提示出現。當它消除了文本，它存儲在附屬的元素數據

您可以使用此行代碼做同樣的：。

$("#my-element").data("ui-tooltip-title", "My new tooltip message");

現在，如果用戶將鼠標從元素上移開，然後將鼠標移回到元素上，它將顯示新文本。

要立即顯示新文本，您需要更新實時工具提示疊加元素，該元素非常容易找到。你只需要你已經更新了文本之後：

$(".ui-tooltip-content").html($("#my-element").data("ui-tooltip-title"));

_{測試在jQuery UI的1.10.0。}

來源

2013-02-28 16:15:47 BG100

謝謝。爲什麼我不能通過'$（this）.attr（「data-ui-tooltip-title」）來訪問它？ – 2013-02-28 18:39:25

我在文檔中看到兩個條目 - http：// api。jquery.com/jQuery.data/和http://api.jquery.com/data/。後者似乎在使用HTML5屬性'data- *'。我假設'$（「＃my-element」）。data（「ui-tooltip-title」）'將數據存儲在別處（？）。 – 2013-02-28 18:49:49

我認爲如果元素具有數據屬性，jQuery只會將信息存儲在HTML5'data-xxx'中。如果它不存在，那麼它將它存儲在內部數組或類似的東西中。 – BG100 2013-03-01 16:01:04

當使用工具提示部件，您可以通過自己的API更新內容：

$(this).tooltip('option', 'content', "New Content Goes Here");

來源

2013-02-17 22:37:49 Pointy

不幸的是，這似乎並沒有對'$工作（這）'因爲我已經設置'document'的提示。 – 2013-02-18 00:48:32

@LordLoh。那也許是因爲你應該這樣做不同的:-) – Pointy 2013-02-18 04:14:37

截至目前，我正在運行'$（document）.tooltip（「destroy」）;'，改變標題屬性和$（document）.tooltip（）;'不是一個優雅的解決方案:-( – 2013-02-18 09:39:23

試試這個：

 


            
 
    
             
  $('document').ready(function() { $('document').tooltip(); $(".btn").click(function(){ alert($(this).attr("title")); if ($(this).attr("title")=="T1"){ $(this).attr("title","T2"); }else{ $(this).attr("title","T1"); } }); });

$（ '文件'）應該是單或雙引號（」或「）和它的作品罰款我 whitout $（ '文件' ）.tooltip（）;

來源

2013-10-30 09:46:41 user2935683

當鼠標懸停在元素上時使用jQuery更改標題屬性

回答

相關問題