Das HTML-Videoelement-Steuerelement wird nicht angezeigt

Question

Ich habe ein Videoelement erstellt und das Steuerelementattribut auf „true“ gesetzt, aber die Steuerelemente werden nicht angezeigt (auch nicht, wenn man mit der Maus darüber fährt)

if (!this._player) {
    this._player = document.createElement('video');
}

this._player.controls = true;
this._player.src = xxxxx;

Stellen Sie außerdem die Breite des Videoelements auf 100 % ein. Der Standort des Containers ist relativ

Was muss ich tun, um die Standard-Videosteuerelemente anzuzeigen

Answer 1

这段代码将创建一个带有默认控件的视频元素。视频元素将被绝对定位，并填满整个屏幕。当视频开始播放或暂停时，事件监听器将在控制台上记录一条消息。

// 获取视频元素
const video = document.querySelector("video");

// 为视频控件添加事件监听器
video.addEventListener("play", function() {
  console.log("视频开始播放");
});

video.addEventListener("pause", function() {
  console.log("视频暂停");
});

video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

<video controls> 
    <source id='mp4' src="http://media.w3.org/2010/05/sintel/trailer.mp4" type='video/mp4' />
</video>