带链接的jquery UI工具提示html
我想使用jquery UI工具提示。
在工具提示中，我希望html中会有一个链接。
我看到这篇文章（ Jquery UI工具提示不支持html内容 ），说明如何在工具提示中使用html。
但是当我想在工具提示中添加链接时会出现问题。
当我带光标进入工具提示点击链接时，工具提示消失了（因为我从分配给工具提示的元素中鼠标输出。
我能做什么？
谢谢。
更新：
$(function () { $(document).tooltip({ content: function () { return $(this).prop('title'); } }); }); 示例 ： http ： //jsfiddle.net/jLkcs/
由于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/
看起来你必须弄脏并编辑jQuery代码，以便在mousout事件中，如果你将鼠标hover在工具提示本身上，它就不会关闭。
或者作为替代方案，您可以查看twitter bootstrap工具提示和popover，我认为从内存中您可以将事件触发器类型传递给popover。
Irvin Dominin接受的回答对我来说是一个巨大的帮助。 如果有人有与我相同的额外要求，我已经扩展了它。
我还想延迟工具提示显示。 因为“show”选项设置为null，所以我需要复制它。 （当鼠标从工具提示移回到调用链接时，show选项设置为null以停止弹出窗口显着重绘）。
我需要延迟，因为我正在开发的页面有很多用户工具提示，当鼠标移动到页面时，即时显示有点刺耳。
我的解决方案是使用open事件隐藏工具提示并在再次显示之前添加超时。 例外情况是，如果相同的工具提示已经打开，并且为了对此进行排序，我在打开/关闭它时为每个元素添加了一个true / false数据属性（从打开和关闭函数中获取源元素并不容易，但是我认为这是对的）。
免责声明：我不是JQuery的高手，可能有一种更简单的方法来复制它。 我有时会用代码卡住兔子洞，所以下面的代码可能是错误的建议……
var ttWait; // global variable for tooltip delay $(document).tooltip({ items: '.userSummaryLink', show: null, content: function() { // build the popup content return $(this).prop('title'); }, open: function (event, ui) { // simulating the show option (that needs to be null to stop the popup closing and reopening when user mouses from popup back to source var el = $(event.originalEvent.target); if( !el.data('tooltip') ) { // only put open delay if SAME popup not already open ui.tooltip.hide(); // stop popup opening immediately ttWait = setTimeout(function() { // show popup after delay el.data("tooltip", true); // acknowledge popup open ui.tooltip.fadeIn("400"); }, 250); } }, close: function (event, ui) { var el = $(event.originalEvent.target); el.data("tooltip", false); // acknowledge popup closed (might be over-ridden below) clearTimeout(ttWait); // stop tooltip delay function ui.tooltip.hover( function () { $(this).stop(true).fadeTo(400, 1); el.data("tooltip", true); // acknowledge popup still open }, function () { $(this).fadeOut("400", function () { $(this).remove(); }); }); } });
请注意，我还在弹出窗口中添加了一些类和定位，以便将箭头添加到调用链接。 另外，我的内容源自页面上加载的用户对象文件。 我删除了这些，希望它更容易使用。