好奇的狗 2022-08-09 01:43 采纳率: 16.7%
浏览 218
已结题

HTML如何跳转视频播放位置，并且播放指定时长后暂停？

HTML如何跳转视频播放位置，并且播放指定时长后暂停？
比如20s的视频，一键跳转到00:06，并指定播放至00:08，然后自动暂停

  • 写回答

5条回答 默认 最新

  • 我啥都会 2022-08-09 11:45
    关注

    尝试下这个吧，可以用

    
```html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 
<html> 
  <head> 
    <title>video</title> 
    <meta http-equiv="pragma" content="no-cache"> 
    <meta http-equiv="cache-control" content="no-cache"> 
    <meta charset="utf-8"> 
  </head> 
 
<body> 
    <div class="container"> 
        <input type="button" value='10-13' onclick="playMedia(10,13)">第10秒开始-13秒时暂停 
        <br > 
        <br > 
        <button onclick="playMedia(50,null)" type="button">从第50秒开始播放到结束</button> 
        <input type="text" id="showTime"/> 
        <br > 
        <br > 
        <video id="video1" autoplay="autoplay" controls=true src='http://www.amdcu.net/admin/data/admin/lm_data/lm_23781/story_content/video_5uVjEQZCagr_30_48_720x406.mp4'> 
        </video> 
    </div> 
 
</body> 
 
<script> 
 
    var myVid=document.getElementById("video1"); 
    myVid.addEventListener("timeupdate",timeupdate); 
 
    var _endTime; 
 
    //视频播放 
    function playMedia(startTime,endTime){ 
        //设置结束时间 
        _endTime = endTime; 
        myVid.currentTime=startTime; 
          myVid.play(); 
    } 
     
    function timeupdate(){ 
        //因为当前的格式是带毫秒的float类型的如：12.231233，所以把他转成String了便于后面分割取秒 
        var time = myVid.currentTime+""; 
        document.getElementById("showTime").value=time; 
        var ts = time.substring(0,time.indexOf(".")); 
        if(ts==_endTime){ 
            myVid.pause(); 
        } 
         
    } 
 
</script> 
</html>

    ```

    评论

报告相同问题？

问题事件

  • 系统已结题 8月17日
  • 创建了问题 8月9日