jquery - jQuery-在外部单击时隐藏各种div

我有一个Alphabeth表，我想在其中单击显示/隐藏带有有关该字母的更多信息的气泡。我对jquery完全陌生，但我设法写下了这一点：

JS：

function toggle(id) {
  $('#' + id).slideToggle();
}

HTML：

<td>
  <a href="javascript:toggle('a')" onmouseover="this.innerHTML='A'" onmouseout="this.innerHTML='あ'">あ</a>
    <div id="a" class="bubble_table">
      <a href=""><div class="img_table"></div></a><p>[a], a </p>
    </div>
</td>

效果很好，但现在我想在单击页面上的其他位置后隐藏气泡，而我被卡住了。有人可以告诉我如何编辑/重写功能来实现吗？可能以最简单的方式？

非常感谢，伊娃

最佳答案

尝试以下操作：

$(document).mouseup(function (e)
    {
        var container = $(".bubble_table");
        if (container.has(e.target).length === 0)
        {
            container.hide();
        }
    });

我希望这会有所帮助。