操作步骤:
1. 创建input 标签,点击选择文件
2. 网页请求全屏element.requestFullscreen方法,无效,不点击input标签则没有问题
示例:
<html>
<head>
<script>
//fullscreen
function requestFullScreen(element) {
if (element.requestFullscreen) {
element.requestFullscreen()
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen()
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen()
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullScreen()
}
}
//is fullscreen
function IsFull() {
var fullscreenElement =
document.fullscreenElement
|| document.mozFullscreenElement
|| document.webkitFullscreenElement;
var fullscreenEnabled =
document.fullscreenEnabled
|| document.mozFullscreenEnabled
|| document.webkitFullscreenEnabled;
if (fullscreenElement == null) {
return false;
} else {
return true;
}
}
//exit fullscreen
function exitFull() {
if (document.exitFullscreen) {
document.exitFullscreen()
} else if (document.msExitFullscreen) {
document.msExitFullscreen()
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen()
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen()
}
}
function clickFull(element){
if(IsFull()){
exitFull()
}else{
requestFullScreen(element)
}
}
</script>
</head>
<body>
<input type="file"/>
<div style="width: 300px;height: 300px; background-color:black;" onclick="clickFull(this)"></div>
</body>
</html>