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中，否则无法定位你的工具提示

DEMO

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()
           }
        });

JQuery工具提示：标题属性中的目标跨度

2 个答案: