视频开启播放视频的功能

Video Onclick function for playing a video

本文关键字:视频 功能 播放      更新时间:2023-09-26

我使用Html设计了一个视频问题,我已经使用Jquery删除了视频控件,所以我需要有onclick功能,就像当我们点击视频时它应该播放,如果我再次点击它应该暂停。

在你的html代码下面

  <video id="video" width="1180" height="664" poster="put here your poster url" preload="auto">
        <source src="put here your video url" type="video/mp4">      
   </video>

jquery代码

  var video = document.getElementById("video");
  video.addEventListener("click", function(event) { 
        if (video.paused == true) {
             video.play();
        }
        else{
             video.pause();
        }
  });

您可以像这样拍摄playpause。这应该能够切换:

$(document).ready(function(){ 
    $('YOUR_VIDEO_ID_OR_CLASS').click(function(){ 
       $(this).get(0).paused ? $(this).get(0).play() : $(this).get(0).pause(); 
    }); 
 });

一个简单的方法是:

$(function() {
    var video = $('video')[0];
    $('button').click(function() {
        if( video.paused ) {
            video.play();
        }
        else {
            video.pause();
        }
    });
});

小提琴例子

您可以将'button'更改为另一个元素作为播放/暂停的触发器。你也可以将其更改为视频本身,如果你只想点击视频播放并暂停它

这就是你需要的:

<script type="text/javascript"> 
function vidplay() { 
var video = document.getElementById("Video1"); 
var button = document.getElementById("play"); 
if (video.paused) { 
video.play(); 
button.textContent = "||";
 } 
else 
{ 
video.pause(); 
button.textContent = ">"; 
} 
} 
</script>