当用户同时按下“ Space”和“ Enter”键时，我试图在网页中提供全屏选项。我有以下代码。我有以下代码。但这是行不通的。我要去哪里错了？如果我给一个键，那是可行的。
<!doctype html>
<html>
<head>
<title>Full Screen Example</title>
<style type="text/css">
:-webkit-full-screen #myimage {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<p>Press "space" and "enter" to enter full screen</p>
<p><strong>To use full-screen mode, you need Firefox 9 or later or Chrome 15 or later.</strong></p>
<img src = "./3.jpg" width="640" height="360" id="myimage">
</body>
<script>
var imageElement = document.getElementById("myimage");
function toggleFullScreen() {
if (!document.mozFullScreen && !document.webkitFullScreen) {
if (imageElement.mozRequestFullScreen) {
imageElement.mozRequestFullScreen();
} else {
imageElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
}
} else {
if (document.mozCancelFullScreen) {
document.mozCancelFullScreen();
} else {
document.webkitCancelFullScreen();
}
}
}
document.addEventListener("keydown", function(e) {
if ((e.keyCode == 13) && (e.keyCode == 32)) {
toggleFullScreen();
}
}, false);
</script>
最佳答案
删除当前的addEventListener（）调用，并使用下面提供的内容扩展脚本。请注意，这在IE8中不起作用（但考虑到您正在使用moz和webkit函数，我想您无论如何都不会将其作为目标）。
var keys = [];
function keyIsDown(keyCode) {
return (keys.indexOf(keyCode) > -1);
}
document.addEventListener("keydown", function(e) {
// Remember the key being pressed
keys.push(e.keyCode);
// Check if ENTER and SPACE are both being pressed
if (keyIsDown(13) && keyIsDown(32)) {
toggleFullScreen();
}
}, false);
document.addEventListener("keyup", function(e) {
// Remember that this key is no longer being pressed
var keyIndex = keys.indexOf(e.keyCode);
if (keyIndex > -1) keys.splice(keyIndex, 1);
}, false);
相信parjun的基本想法；我只是在没有jQuery的情况下解决了这个问题。
关于javascript - 全屏选项，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/17985994/