webkitRequestFullScreen不是函数

Question

I was trying to call a function to make the screen in full screen mode again , when ESC is pressed.(that is when ESC is pressed the screen goes normal mode.I need to make it again in full screen).Identified the ESC click event called the full screen function again like,

$(document).ready(function (){
var screen_change_events = "webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange";
$(document).on(screen_change_events, function () {
if (!window.screenTop && !window.screenY) {
$("iframe")['webkitRequestFullScreen'](); // Identified that ESC is triggered.So need to make it again fullscreen mode
}else{
//alert("no")
}
});
});

But getting the below error.

Uncaught TypeError: $(...).webkitRequestFullScreen is not a function

Answer 1

With $("iframe")['webkitRequestFullScreen'](); you are making a jQuery object and attempting to call its "webkitRequestFullScreen" method, but jQuery objects don't have this method - only element objects do.

You can get the elements from a jQuery object by indexing them like you would with an array (ie $("iframe")[0].webkitRequestFullScreen() ), but if you can, it's best to give the iframe element that you are selecting a unique ID, and then use that:

In your HTML:

<iframe id="myvideo" src="..."></iframe>

In your JavaScript:

var elem = document.getElementById("myvideo");
if (elem.webkitRequestFullscreen) {
  elem.webkitRequestFullscreen();
}

Also, note that prefixing the method with "webkit" will only work on Webkit-based browsers. To see the different methods available on different browsers and how to call them, see the MDN docs .