Jquery 单击“关闭div”或单击“外部选项卡”

我有一个页面的标题中有一个非常标准的弹出菜单。规范规定，用户需要能够通过三种方式关闭它：

通过在菜单外单击

通过单击第二次展开的链接（滑动切换）

通过在菜单外使用tab键

我有第一个在工作，但我似乎不知道其他两个。第二次单击链接时，它会向上滑动，然后向下滑动。我曾经尝试使用jquery“focusout”在用户弹出标签时关闭菜单，但没有成功

以下是我的js：

$("#body").mouseup(function (e) {
    var subject = $("#shell-user-account-details");
    if (e.target.id != subject.attr('id') && !subject.has(e.target).length) {
        subject.hide();
    }
    $("#shell-user-account-details").attr('aria-hidden', function (i, attr) {
        return attr == 'true' ? 'false' : 'true';
    }).attr('aria-expanded', function (i, attr) {
        return attr == 'false' ? 'true' : 'false';
    });
});

$(document).on('click', '#shell-user-account-link', function (event) {
    $('#shell-user-account-details').slideToggle().attr('aria-expanded', function (i, attr) {
        return attr == 'false' ? 'true' : 'false';
    }).attr('aria-hidden', function (i, attr) {
        return attr == 'false' ? 'true' : 'false';
    })
});

这是一把小提琴：

---

谢谢。

第二个问题你试过这个了吗

     $("#idofyourlink").click(function(){$("#idofyourpopup").toggle();})

关于第三个问题，您是否尝试将该菜单的

tabindex

属性设置为“0”？然后在脚本中添加以下内容：

     $("#idofyourmenu").blur(function(){$("#idofyourpopup").hide();});

---

切换解决方案根本不起作用。模糊解决方案可以工作，但它会产生第二个问题：您不能在菜单中的链接上使用tab键。打开菜单并单击tab按钮后，它会立即关闭菜单。绝对不要将元素设置为tabindex=“0”，该元素必须是可选项卡的，因为您要将其从可访问性流中移除。更新：我已经知道如何在第二次单击时关闭菜单。还没弄清楚账单的事。