Javascript 按下空格键时暂停HTML5视频

Javascript 按下空格键时暂停HTML5视频,javascript,jquery,html,html5-video,Javascript,Jquery,Html,Html5 Video,我有一个脚本,当按下空格键时应该暂停HTML5视频。但在Firefox中,它会在你按下的所有键上暂停,无论是空格键还是其他键,而在Chrome中它根本不起作用 此外,双击视频不会进入全屏 $(window).keypress(function(e) { if (e.keyCode == 0) { if (video.paused == true) video.play(); else video.pause(); }

我有一个脚本,当按下空格键时应该暂停HTML5视频。但在Firefox中,它会在你按下的所有键上暂停,无论是空格键还是其他键,而在Chrome中它根本不起作用

此外,双击视频不会进入全屏

$(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();
});

小提琴:双击不会进入全屏;您必须添加该操作。至于暂停,请尝试jQuery事件的
属性

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

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

双击不会进入全屏;您必须添加该操作。至于暂停,请尝试jQuery事件的
属性

$(window).keypress(function(e) {
    // debugger;
    if (e.which == 32) {
        if (video.paused == true)
            video.play();
        else
            video.pause();
    }
});
取消对调试器的注释,以便可以检查发生的事件。

请尝试下面的代码段

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();
  }
};
正在工作

请尝试下面的代码片段

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();
  }
};

工作时使用
keyup
Event.keyCode===32


如果愿意,在本例中也可以使用
keydown
,因为您没有测试输入值。

使用
keydup
Event.keyCode==32


如果您愿意,在本例中也可以使用
键控
,因为您没有测试输入值。

确定这是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>

$('#videoID')。单击(函数(){this.pause?this.play():this.pause();});
$(窗口)。按键(功能(e){
如果(e.keyCode==32 | | e.keyCode==32){
$('videoID').get(0).暂停?$('videoID').get(0).播放():$('videoID').get(0).暂停();
}
});

好,这是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>

$('#videoID')。单击(函数(){this.pause?this.play():this.pause();});
$(窗口)。按键(功能(e){
如果(e.keyCode==32 | | e.keyCode==32){
$('videoID').get(0).暂停?$('videoID').get(0).播放():$('videoID').get(0).暂停();
}
});
试试这个片段

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

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

双击视频不会进入全屏
为什么会自动进入全屏?这不是YouTube。这是否意味着YouTube拥有这项技术的版权/专利(特别是在空格键上暂停)?我遇到的所有视频播放软件都不支持使用空格键暂停,考虑到用户体验,可以将其视为标准功能。
双击视频不会进入全屏
为什么会自动进入全屏?这不是YouTube。这是否意味着YouTube拥有这项技术的版权/专利(特别是在空格键上暂停)?我遇到的所有视频播放软件都不支持使用空格键暂停,因为空格键关注用户体验,这可以被认为是一个标准功能。@dandavis-哈哈,想想已经晚了。谢谢@丹达维斯-哈哈,我想已经很晚了。谢谢jQuery版本?jQuery版本?