Javascript 除了单击小部件外，如何在模糊上隐藏小部件？

我正在构建一个类似于a的小部件，但是当（a）用户从输入框中弹出，或者（b）在小部件和输入之外单击时，我不知道如何使它消失

将模糊事件绑定到输入框很容易，但问题是，当您单击小部件时，它会被触发，并且似乎无法确定从模糊事件内部将焦点更改为哪个元素

当用户在输入之外单击时关闭小部件也有点粗略，但这是可行的：

$('body').on('click', function(e) {
    if(e.target != self.element[0] && e.target != self.clock[0] && !$.contains(self.clock[0], e.target)) {
        self.clock.hide();
    }
});

---

但是，如果我能找出如何正确处理模糊事件（也可能是通过在元素外部进行tab触发的），我就不需要这样做了。

事实证明，解决方案其实非常简单。多亏了罗乔卡的建议，我想到了以下几点：

this.timepicker.on('mousedown', function(e) {
    return false;
});
this.element.on('blur', function(e) {
    self._parseInput();
    self._refreshInput();
    self._close();
});

mousedown

事件首先触发，通过返回false，它可以防止在单击小部件时触发模糊事件。其他一切（在小部件和输入框外单击，或用Tab键移开）都会导致模糊，从而根据需要关闭小部件

---

此外，它还有一个令人愉快的副作用，即在与小部件交互时将光标保持在文本框内

事实证明，解决方案其实很简单。多亏了罗乔卡的建议，我想到了以下几点：

this.timepicker.on('mousedown', function(e) {
    return false;
});
this.element.on('blur', function(e) {
    self._parseInput();
    self._refreshInput();
    self._close();
});

mousedown

事件首先触发，通过返回false，它可以防止在单击小部件时触发模糊事件。其他一切（在小部件和输入框外单击，或用Tab键移开）都会导致模糊，从而根据需要关闭小部件

---

此外，它还有一个令人愉快的副作用，即在与小部件交互时将光标保持在文本框内

Chrome有一个

e.relatedTarget

属性，该属性赋予焦点已切换到的元素，但前提是它是另一个输入元素。如果组成我的Widget的

在模糊之前按下鼠标，则单击其中一个按钮将为空。您可能想尝试听一听，而不是单击。@rojoca:这实际上似乎工作得非常好……Chrome有一个

e.relatedTarget

属性，该属性将焦点切换到该元素，但前提是它是另一个输入元素。如果组成我的Widget的

在模糊之前按下鼠标，则单击其中一个按钮将为空。你可能想试着去听，而不是点击。@rojoca:这实际上似乎效果非常好。。。