带链接的jquery UI工具提示html

Question

我想使用jquery UI工具提示.

在工具提示中,我希望html中会有一个链接.

我看到这篇文章(Jquery UI工具提示不支持html内容),说明如何在工具提示中使用html.

但是当我想在工具提示中添加链接时会出现问题.

当我带光标进入工具提示点击链接时,工具提示消失了(因为我从分配给工具提示的元素中鼠标输出.

我能做什么？

谢谢.

更新:

  $(function () {
      $(document).tooltip({
          content: function () {
              return $(this).prop('title');
          }
      });
  });

示例:http://jsfiddle.net/jLkcs/

Answer 1

由于jQuery UI工具提示的性质不可能开箱即用.

你可以添加一些技巧(在jQuery论坛上找到,但链接丢失了......)让工具提示延迟关闭,让你有时间点击链接.

二手api文档:http://api.jqueryui.com/tooltip/

码:

$(function () {
    $(document).tooltip({
        content: function () {
            return $(this).prop('title');
        },
        show: null, 
        close: function (event, ui) {
            ui.tooltip.hover(
            function () {
                $(this).stop(true).fadeTo(400, 1);
            },    
            function () {
                $(this).fadeOut("400", function () {
                    $(this).remove();
                })
            });
        }
    });
});

演示:http://jsfiddle.net/IrvinDominin/jLkcs/5/