JQuery 工具提示：標題屬性內的目標跨度

Question

我有一個帶有以下代碼的 div：

<div id='mydiv' title="<span id='myspan'>Hi there</span>">

我正在使用 JQuery 的工具提示

            $("#mydiv").tooltip({
                content: function () {
                    return $(this).prop('title');
                },
               open: function (event, ui) {
                   ui.tooltip.css("max-width", "800px")

               },
               position:{
                    my:"left+10 top+25",
                    at:"left top"
               }
            });

工具提示工作正常，但我無法定位工具提示內的跨度， $('#myspan').html()返回 null。

有任何想法嗎 ？

謝謝 ！

Answer 1

這是因為 jQuery 工具提示的工作方式。 每次將 div 懸停時，都會使用工具提示創建一個元素並附加到 DOM。 每次你移除懸停時，這個元素都會從 DOM 中移除。 所以你不能瞄准它。 DOM 上沒有。 在 DOM 中，只有當您將 div 懸停時。

這是一個更好地理解這一點的例子：

$( "#mydiv" ).hover(
  function() {
    alert($('#myspan').html());
  });

這將為您提供工具提示元素。 但是除非您將鼠標懸停在 div 中，否則無法定位您的工具提示

演示

Answer 2

嘗試使用 onShow 事件

$("#mydiv").tooltip({
            content: function () {
                return $(this).prop('title');
            },
           open: function (event, ui) {
               ui.tooltip.css("max-width", "800px")

           },
           position:{
                my:"left+10 top+25",
                at:"left top"
           },
           onShow: function() {
           $('#myspan').html()
           }
        });