如何使用 javascript 暂停 html5 视频?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/16194228/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 03:39:08  来源:igfitidea点击:

How pause a html5 video with javascript?

javascriptjquery

提问by marius

Initially video is hidden.When click image with id '3', video is visible.I put a button with id 'close_video' that will hide player.The problem is still running video.How pause this?

最初视频是隐藏的。当单击 id 为“3”的图像时,视频是可见的。我放了一个 id 为“close_video”的按钮来隐藏播放器。问题仍在运行视频。如何暂停?

The code is:

代码是:

  <div id="video" class="popup-video">
                <div class="video">
                    <div class="close_video" id="close_video">
                        </div>
                        <video id="id_video" width="400" height="257" controls="controls" preload="auto">
                          <source src="{$content_dir}themes/trendy/video/Wildlife.mp4" type="video/mp4" />    
                        </video>                         
                </div>
    </div>  

<script>
   $(document).ready(function(){
      $('#3').click(function(){
        $("#video").removeClass("popup-video").addClass("popup-video-show");
      });
   });
</script>
<script>
   $(document).ready(function(){
       $('#close_video').click(function(){
         $("#video").removeClass("popup-video-show").addClass("popup-video");
       });
  });
</script>

I tried this:

我试过这个:

<script>
   $(document).ready(function(){
      $('#close_video').click(function(){
         $("#video").removeClass("popup-video-show").addClass("popup-video");
         document.getElementById('id_video').pause();
         // and $("#id_video").pause();
       });
   });
</script>

but no effect.The video dissapear, but is still runing

但没有效果。视频消失了,但仍在运行

回答by Dan Esparza

When using jQuery, you'll need to use 'get' first:

使用 jQuery 时,您需要先使用“get”:

$('#videoId').get(0).pause()

回答by marius

Normally you only need to click on the video to pause/play it.

通常,您只需单击视频即可暂停/播放。

Instead of using the pause()try to use the click()

而不是使用pause()尝试使用click()

回答by UmbrellaINC

When working with HTML5, use:

使用 HTML5 时,请使用:

document.getElementById(\"movie_player\").click()

It works for me.

这个对我有用。