d3.js要素の外側をクリックすると、要素が非表示になります

Question

私のページにはいくつかのヒントがあります。 1つのツールチップ（div）に入力ボックスとボタンがあります。私はツールチップの外側をクリックし、ツールチップを隠したいと思う。私はこれを試しました：

これは動作しますが、入力ボックスをクリックして値を入力したい場合、ツールチップはまだ隠れています。ツールチップの外側をクリックしたときにのみ、どのようにツールチップを隠すことができますか？

私も試してみました：

d3.select("body").filter().on("click",function(){}) 

しかし、私はそれがどのように動作するかしないでください、私はツールチップ（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/