Question

我有这个脚本，当按下空格键时应该暂停HTML5视频。在Firefox中它可以暂停你按下的所有按键，无论是空间还是其他按键，在Chrome中它根本无法工作。

同时双击视频doesen不会全屏显示。

$(window).keypress(function(e) {
  if (e.keyCode == 0) {
    if (video.paused == true)
            video.play();
        else
            video.pause();
  }
});


$video.dblclick(function() {
    video.mozRequestFullScreen();
   video. webkitRequestFullscreen();
   video.requestFullscreen();
});

小提琴：http://jsfiddle.net/6f7navgu/4/

Answer 1

尝试下面的代码段

var video = document.getElementById('video_id');   
document.onkeypress = function(e){
    if((e || window.event).keyCode === 32){
        video.paused ? video.play() : video.pause();
    }
};

要使视频处于全屏模式，请使用以下

var video = document.getElementById("video_id");
document.ondblclick = function(){
    if(video.requestFullscreen){
        video.requestFullscreen();
    }else if(video.mozRequestFullScreen){
        video.mozRequestFullScreen();
    }else if(video.webkitRequestFullscreen){
        video.webkitRequestFullscreen();
  }
};

工作jsBinl

Answer 2

改为使用keyup和Event.keyCode === 32。 Fiddle

如果您愿意，在这种情况下也可以使用keydown，因为您没有测试输入值。

Answer 3

双击不会全屏显示;你必须添加该动作。至于暂停，请尝试jQuery事件的which属性。

$(window).keypress(function(e) {
    // debugger;
    if (e.which == 32) {
        if (video.paused == true)
            video.play();
        else
            video.pause();
    }
});

取消对调试器的注释，以便您可以检查发生的事件。

Answer 4

好的，这是jquery，它暂停并播放带空格的视频，并在视频窗口点击：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
            <script>
            $('#videoID').click(function(){this.paused?this.play() :this.pause();});
            $(window).keypress(function(e) {
            if (e.keyCode == 32 || e.keyCode === 32) {
            $('#videoID').get(0).paused?$('#videoID').get(0).play() :$('#videoID').get(0).pause();
            }
            });
            </script>

Answer 5

尝试此代码段

$(window).keypress(function(e) {
    if (e.which == 32) {
        video.paused ? video.play() : video.pause();
    }
});
video.ondblclick = function(){
        video.requestFullscreen();
};

按空格键时暂停HTML5视频

5 个答案: