<div class="video-div">

      
    
      
         
          
          
      
       {
   {currentTime*1000 | date:'mm:ss'}}
      
  
       
         
      
      
       
        
        
      
       
    
      
  
       
         
          
      
       {
   { durationLength*1000 | date:'mm:ss' }}
      
  
     
    
    
  
     
试学结束，请购买后学习完整课程
  
     立即购买
    
    
      
     
      
     

</div>

**

一：控制视频播放暂停

**

this.myVideo = this.runtime.plugins.JQuery('#videoAttr');if(this.myVideo[0].paused){  this.myVideo[0].play();  this.progressFlag = setInterval(() =>{    this.getProgress();  },1000);  this.isPlay = true;//播放暂停按钮切换  this.runtime.plugins.JQuery('.arrowback2').remove();}else{  //暂停播放  this.myVideo[0].pause();  clearInterval(this.progressFlag);  this.isPlay = false;}

}

二：试看功能，播放进度条功能

//获取进度条

this.myVideo = this.runtime.plugins.JQuery('#videoAttr');this.progressWrap = this.runtime.plugins.JQuery('.progressWrap');this.playProgress = this.runtime.plugins.JQuery('.playProgress');this.durationLength = this.myVideo[0].duration;this.currentTime = this.myVideo[0].currentTime;console.log('666',this.currentTime);this.percent = this.currentTime / this.durationLength;      //获取视频播放到百分比this.playProgress.width(this.percent * (this.progressWrap[0].offsetWidth));//试看时间控制if(parseInt(this.currentTime) == 1000){  this.runtime.plugins.JQuery('.video-bg').css("display","block");  this.myVideo[0].pause();}

}

三：点击进度条位置 跳转到指定视频播放的位置

// 鼠标在播放条上点击时进行捕获并进行处理

clearInterval(this.progressFlag);this.progressWrap = this.runtime.plugins.JQuery('.progressWrap');this.playProgress = this.runtime.plugins.JQuery('.playProgress');var length = e.pageX - this.progressWrap[0].offsetLeft;this.percent = length / this.progressWrap[0].offsetWidth;this.playProgress.width(this.percent * (this.progressWrap[0].offsetWidth));this.myVideo[0].currentTime = this.percent * this.myVideo[0].duration;this.myVideo[0].play();//播放this.progressFlag = setInterval(() =>{  this.getProgress();},1000);

}