video通过按钮控制视频播放

页面初始化

<div >
    <video id="video_1" width="100%" height="100%">
          <source src="../assets/1.mp4" type="video/mp4"/>
    </video>
    <el-button  @click="playPause()">播放</el-button>
</div>

点击按钮

playPause (data) { // 播放视频
      var that = this // 在addEventListener中不能直接使用this
      var video_change = document.getElementById('video_1')
      if (video_change.paused) {
        video_change.play()
      } else {
        video_change.pause()
      }
      video_change.addEventListener('ended', function () { // ended: 视频播放结束时，调用方法，如果在方法中修改属性值或者调用其他的方法不能直接使用this,使用that
      
      }, false)
    }

方法

具体使用的其他方法戳这里:js