Javascript D3树节点双击高亮显示文本

我有一个树状视图（类似于），只是我将“展开/收缩”节点从单击更改为双击事件：

也就是说，而不是

.on("click", function(d) { toggle(d); update(d); });

我正在使用：

.on("dblclick", function(d) { toggle(d); update(d); });

它的功能很好。问题在于双击会高亮显示节点上的文本标签。这不会影响过渡，但非常烦人。除了删除节点并在转换结束时将其添加回，是否有人知道防止这种情况发生的方法

顺便说一句，我已经尝试添加

d3.event.preventDefault()

---

在双击事件中，它没有任何帮助。

谷歌返回了以下结果：

那页上的代码是

$(function(){
    $.extend($.fn.disableTextSelect = function() {
        return this.each(function(){
            if($.browser.mozilla){//Firefox
                $(this).css('MozUserSelect','none');
            }else if($.browser.msie){//IE
                $(this).bind('selectstart',function(){return false;});
            }else{//Opera, etc.
                $(this).mousedown(function(){return false;});
            }
        });
    });
    $('.noSelect').disableTextSelect();//No text selection on elements with a class of 'noSelect'
});

---

但是，在这种情况下，您可以将“.noSelect”替换为“.node”，它应该禁用所有节点的文本高亮显示。

如果您不想完全禁用文本选择（这对用户来说通常更好），您可以通过手动取消选择元素

但是，由于SVG API在许多情况下还没有完全实现，因此这种方法还不能跨浏览器使用。（至少在铬合金中工作）

更好的跨浏览器方式是重写文本。这通常也会终止选择：

g.on("dblclick", function(d) {
    toggle(d); update(d);
    var text = d3.select(this).select("text")
    var value = text.text()
    text.text(value)
})

---

这至少在Firefox和Chrome中起作用。

我还发现了以下关于通过CSS禁用选择效果的链接，但如果我以后想在页面中添加选择功能，该选项似乎更具侵入性。这仍然是一个很好的选择。或者，用div覆盖文本：

g.on("dblclick", function(d) {
    toggle(d); update(d);
    var text = d3.select(this).select("text")
    var value = text.text()
    text.text(value)
})