Реализация Popover в JavaScript

Question

Я хочу сделать свой контроль поповера. Большинство проблем, таких как ориентация стрелы, позиционирование поповера и т. Д., Я могу решить самостоятельно. Единственное, в чем я не уверен, как это сделать наилучшим образом, - это как скрыть это, когда пользователь нажимает снаружи. Любая ссылка на хороший пример или советы по внедрению приветствуются.

Answer 1

Я думаю, что лучшим способом было бы привязать обработчик mousedown к document.body и проверить, был ли клик внутри popover.el.

   var popover = Ext.create('Your.Poopover', {/* ... */});

   popover.mon(Ext.getBody(), 'mousedown', function(e) {
     if (popover.isVisible() && !e.within(popover.el))
       popover.hide();
   });

Answer 2

Событие .blur () отправляется элементу, когда он теряет фокус.

Answer 3

document.addEventListener("click", function (ev) {
  hidePopOverIfClickOutside(ev);
});