如何获取h5中 video标签自带播放器的播放暂停事件

你可以使用 JavaScript 来监听 video 标签自带播放器的播放和暂停事件。

HTML 代码：

<video id="myVideo" controls>
  <source src="myVideo.mp4" type="video/mp4">
</video>

JavaScript 代码：

var video = document.getElementById("myVideo");

video.addEventListener("play", function() {
  console.log("视频开始播放");
});

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

在 JavaScript 代码中，我们使用 `addEventListener` 方法来监听 video 标签的 `play` 和 `pause` 事件。在事件触发时，会执行相应的回调函数。

当视频开始播放时，会触发 `play` 事件，并输出 "视频开始播放"。当视频暂停播放时，会触发 `pause` 事件，并输出 "视频暂停播放"。

通过这种方式，你可以在视频播放和暂停时执行相应的自定义操作。

相关问题

h5中 video标签的controls属性自带的播放暂停按钮如何自定义

如果想要自定义video标签自带的播放和暂停按钮，可以使用CSS样式来实现。需要先将controls属性设置为false，这样就可以隐藏自带的按钮。然后在CSS中使用:before和:after伪元素来创建自定义的按钮图标，并使用JavaScript来实现按钮的功能。

以下是一个示例代码：

HTML代码：

<video id="myVideo" controls="false">
  <source src="myVideo.mp4" type="video/mp4">
</video>

CSS代码：

#myVideo::-webkit-media-controls-play-button:before {
  content: "\f04b"; /* FontAwesome play icon */
  font-family: FontAwesome;
  font-size: 24px;
  color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#myVideo::-webkit-media-controls-pause-button:before {
  content: "\f04c"; /* FontAwesome pause icon */
  font-family: FontAwesome;
  font-size: 24px;
  color: #fff;
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

JavaScript代码：

var video = document.getElementById("myVideo");
var playButton = document.querySelector("#myVideo::-webkit-media-controls-play-button");
var pauseButton = document.querySelector("#myVideo::-webkit-media-controls-pause-button");

playButton.addEventListener("click", function() {
  video.play();
});

pauseButton.addEventListener("click", function() {
  video.pause();
});

这样就可以自定义video标签的播放和暂停按钮了。

h5 禁用浏览器自带播放器

禁用浏览器自带播放器可以通过以下两种方式实现：

1.使用特定的HTML代码

在HTML代码中，可以使用以下代码来禁用浏览器自带的播放器：

<video controlsList="nodownload">
  <source src="video.mp4" type="video/mp4">
</video>

其中，控件列表属性（controlsList）设置为“nodownload”可以禁用下载按钮，从而防止用户下载视频。

2.使用JavaScript代码

使用JavaScript代码可以通过监听视频元素的播放事件来禁用浏览器自带的播放器。以下是一个示例代码：

var video = document.getElementById('myVideo');
video.addEventListener('play', function() {
  video.controls = false;
}, false);

其中，“myVideo”是视频元素的ID，监听视频元素的播放事件，并将控件列表属性（controls）设置为false，从而禁用浏览器自带的播放器。