動態設置工具提示文本到div元素

Question

我想動態地將工具提示文本設置爲容器（div），並使用jQuery爲每個div元素（elem.Alias-Status）添加有序列表：

function addNewElement(elem) { 

    var li = $("<li></li>"); 

    li.prop("class", "ui-state-default"); 
    li.prop("id", elem.Alias); 
    li.text(elem.Name); 

    var newItem = '<div id="' + elem.Alias + '-Status" class="elementStatus" tooltipText="' + elem.IP + '"><div class="image"><img id="' + elem.Alias + '-StatusImg" src="@Url.Content("~/images/ongoing.gif")"></div><div id="' + elem.Alias + '-StatusTxt" class="text">Waiting...</div></div>'; 
    //$('#' + elem.Alias + '-Status').prop('tooltipText', elem. IP); 

    li.append(newItem); 

    li.appendTo($("#OuterDivContainer"));  
}; 

但它顯然不工作。在運行時，當我將鼠標懸停在它們中的每一個上時，都不顯示工具提示。而且......我不知道該怎麼做。我需要在創建該項目的同時創建該項目。

上述函數是從遍歷所有項目（元素）的另一個函數調用的。然後這個函數作爲參數elem傳遞給addNewElement函數。

任何想法？

我使用jQuery UI的1.10.3和jQuery 1.10.2

Answer 1

根據API（http://api.jqueryui.com/tooltip/#option-content），在您的情況要做到這一點的方法是追加的容器後，初始化工具提示。

$('#' + elem.Alias + '-Status').tooltip({ content: elem.IP }); 

當然，你也可以改變提示內容初始化後是這樣的：

$('#' + elem.Alias + '-Status').tooltip("option", "content", "New Content"); 

最近，我有這種鬥爭，發現了很多其他辦法，包括你想盡了辦法，而你的情況不起作用，因爲工具提示尚未初始化。但這是正確的方法，併爲我工作。

Answer 2

工作對我來說：

$(yourElement).prop('title', 'yourText');