Question

我的页面中有一些文字。有一个工具提示（div）包含一个输入框和一个按钮。我想在工具提示外单击，然后隐藏工具提示。我试过这个：

RAILS_ENV=production bundle exec rake assets:precompile

这样可行，但是当我单击输入框想要输入一些值时，工具提示仍然隐藏。如果我在工具提示外单击，我该如何隐藏工具提示？

我也尝试过：

d3.select("body")
.on("click",function(){
    d3.select("#tooltip")
    .classed("hidden",true);
});

但我不知道它是如何工作的，我不能选择除工具提示（div）之外的所有元素。

Answer 1

这是一个解决方案：

var tooltip = d3.select("#tooltip");
var tooltipWithContent = d3.selectAll("#tooltip, #tooltip *");

function equalToEventTarget() {
    return this == d3.event.target;
}

d3.select("body").on("click",function(){
    var outside = tooltipWithContent.filter(equalToEventTarget).empty();
    if (outside) {
        tooltip.classed("hidden", true);
    }
});

JSFiddle：https://jsfiddle.net/LukaszWiktor/53yok58w/

d3.js单击元素外部时，隐藏元素

1 个答案: