HTMLVideoElement：leavepictureinpicture 事件
当 HTMLVideoElement 成功退出画中画模式时，会触发 leavepictureinpicture 事件。
此事件不可取消，也不会冒泡。
语法
在诸如 addEventListener() 之类的方法中使用事件名称，或设置事件处理程序属性。
js
addEventListener("leavepictureinpicture", (event) => { })
onleavepictureinpicture = (event) => { }
事件类型
一个 PictureInPictureEvent。继承自 Event。
事件属性
此接口还继承了其父接口 Event 的属性。
示例
这些示例为 HTMLVideoElement 的 leavepictureinpicture 事件添加了一个事件监听器，然后在事件处理程序响应事件触发时发布一条消息。
使用 addEventListener()
js
const video = document.querySelector("#video");
const button = document.querySelector("#button");
function onExitPip() {
console.log("Picture-in-Picture mode deactivated!");
}
video.addEventListener("leavepictureinpicture", onExitPip);
button.onclick = () => {
if (document.pictureInPictureElement) {
document.exitPictureInPicture();
}
};
使用 onleavepictureinpicture 事件处理程序属性
js
const video = document.querySelector("#video");
const button = document.querySelector("#button");
function onExitPip() {
console.log("Picture-in-Picture mode deactivated!");
}
video.onleavepictureinpicture = onExitPip;
button.onclick = () => {
if (document.pictureInPictureElement) {
document.exitPictureInPicture();
}
};
规范
| 规范 |
|---|
| 画中画 # eventdef-htmlvideoelement-leavepictureinpicture |
| 画中画 # dom-htmlvideoelement-onleavepictureinpicture |
浏览器兼容性
加载中…