HTMLElement: phương thức hidePopover()

Baseline 2024
Newly available

Since April 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Phương thức hidePopover() của giao diện HTMLElement ẩn phần tử popover (nghĩa là phần tử có thuộc tính popover hợp lệ) bằng cách xóa nó khỏi top layer và đặt kiểu display: none.

Khi hidePopover() được gọi trên một phần tử đang hiển thị có thuộc tính popover, một sự kiện beforetoggle sẽ được kích hoạt, tiếp theo là popover bị ẩn, rồi sự kiện toggle kích hoạt. Nếu phần tử đã bị ẩn, một lỗi sẽ được ném ra.

Cú pháp

js
hidePopover()

Tham số

Không có.

Giá trị trả về

Không có (undefined).

Ngoại lệ

InvalidStateError DOMException

Được ném ra nếu popover đã bị ẩn.

Ví dụ

Ẩn popover

Ví dụ sau cung cấp chức năng ẩn popover bằng cách nhấn một phím cụ thể trên bàn phím.

HTML

html
<button popovertarget="mypopover">Toggle popover's display</button>
<div id="mypopover" popover="manual">
  You can press <kbd>h</kbd> on your keyboard to close the popover.
</div>

JavaScript

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

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

Kết quả

Thông số kỹ thuật

Specification
HTML
# dom-hidepopover

Tương thích trình duyệt

Xem thêm