Question

我有一个程序，通过使用d3.js从数组动态生成族谱。我想悬停每个节点时显示他们的信息。例如：将祖父节点悬停并显示其姓名和地址。我该怎么做？

我已尝试过这个，但当我悬停一个节点时，也会显示其他节点的信息。

$(document).ready(function(){

    var $str = $(this).find("text");

  $(".node").hover(function(){
        $str.css("visibility", "visible");
    }, function(){
         $str.css("visibility", "hidden");
    });
 });

请帮忙。谢谢！

Answer 1

如果您尝试将事件处理程序附加到动态创建的内容，则可能遇到jquery尝试将处理程序附加到尚不存在的元素的问题。我不熟悉D3，但我知道它有很多功能，可能会为你做到这一点。

但是，另一个可能有用的解决方案是将悬停效果委托给包含元素（例如包装器div或主体）。如下所示：

$('body').on('mouseenter mouseleave', '.node', function(event) {
  if (event.type === 'mouseenter') {
    $str.show();
  }
  if (event.type === 'mouseleave') {
    $str.hide()
  }
});

使用JQUERY在族树中悬停节点

1 个答案: