多个jQuery UI工具提示

时间:2013-12-11 15:41:25

标签: jquery jquery-ui internet-explorer d3.js tooltip

我使用d3.js创建商品市场的可缩放树形图,效果很好,但现在我试图在每个鼠标输入单元格中显示jQuery UI工具提示然后隐藏(或销毁或关闭) )鼠标退出时的工具提示并显示另一个(或相同的工具提示,因为我只想一次显示一个工具提示)。我写的代码在Chrome和Mozilla中按预期工作(见下图), Mozilla and Chrome Experience

但是当我在IE 11中测试时,工具提示仍然存在,并且在鼠标退出时不会消失(参见下图)。 IE 11 Experience

chart.selectAll("g.cell.child")
  .enter()
  .append("g")
  .on("mouseenter", function (d) {
    showToolTip(d, this);
  });

function showToolTip (d, t) {
   var htmlMarkup = ""; // Create some HTML to place in tooltip
   $(t).tooltip({ items: t, content: htmlMarkup, close: function (event, ui) {
   }, open: function (event, ui) {
   }});
}

我不确定是否是最好的方法创建工具提示是最好的方法,但因为它大部分时间和快速工作我认为它很好,直到我看到它在IE中不起作用。什么是创建一个工具提示然后只需移动它并在需要时更改其内容的最佳方法?

1 个答案:

答案 0 :(得分:0)

在浏览网页后,我能够通过以下代码找到解决方案:

$(".ui-tooltip").remove();

这可能不是最好的方法,但适用于IE和Chrome。