在点击时显示，但点击其他任何地方隐藏

Question

我正在创建一个工具提示。我希望用户单击链接以显示工具提示，然后单击其他任何位置以隐藏它。或者，如果他们点击页面上的另一个工具提示，则应隐藏当前的工具提示，并显示新的工具提示。

这是我目前的代码..

$(".byr").click(function () {
            $(".popup").hide();
            $(this).find(".popup").show();
        });

这个当前代码的问题是如果我打开一个工具提示，没有办法关闭它，除非我打开一个新的，但是然后无法关闭...

我还希望用户点击页面上的任意位置以关闭。感谢

抱歉，小伙子们忘了给代码http://codepen.io/anon/pen/wtkmL

添加链接

Answer 1

尝试：将click事件绑定到document而不是链接，并检查点击的元素是否为链接。

   $(document).click(function (e) {
        //close popup
        $(".popup").hide();
        //check if clicked element has class byr
        if(e.target.className.indexOf('byr')!=-1)
         $(this).find(".popup").show();
    });