HTMLElement: метод showPopover()

Метод showPopover() интерфейса HTMLElement отображает элемент поповера (т.е. элемент, имеющий корректное значение атрибута popover) путём добавления его на верхний слой.

Когда метод showPopover() вызывается для элемента с атрибутом popover, который в данный момент скрыт, будет вызвано событие beforetoggle, затем поповер будет отображен, после чего сработает событие toggle. Если элемент уже отображается, будет выброшено исключение.

Нет.

Нет (undefined).

InvalidStateError DOMException

Выбрасывается, если поповер уже отображается.

Следующий пример демонстрирует функциональность отображения поповера при нажатии определённой клавиши на клавиатуре.

Сначала HTML:

<div id="mypopover" popover>
  <h2>Help!</h2>

  <p>You can use the following commands to control the app</p>

  <ul>
    <li>Press <ins>C</ins> to order cheese</li>
    <li>Press <ins>T</ins> to order tofu</li>
    <li>Press <ins>B</ins> to order bacon</li>
    <hr />
    <li>Say "Service" to summon the robot waiter to take your order</li>
    <li>Say "Escape" to engage the ejector seat</li>
  </ul>
</div>

Теперь JavaScript для реализации функциональности:

const popover = document.getElementById("mypopover");

document.addEventListener("keydown", (event) => {
  if (event.key === "h") {
    popover.showPopover();
  }
});

• API поповеров