How to disable/enable HTML5 Video tag using JavaScript

Question

Below code is not working, How can disable HTML5 video tag

document.getElementById("vidEle").disabled=true;

If I use

document.getElementById("vidEle").controls=false;

Still I am able to play using right click.

Answer 1

您可以删除视频源，以便视频无法播放:)

Answer 2

It would be nice if we knew the browser you are using, but here are some workarounds:

You can set a new block element on top of it with the same size as the video player with a translucent background using css.

Or you could set the style of your element to display none:

document.getElementById("vidEle").style.display="none";

And lastly you can also unload the content of the vidEle element. One last thing, make sure the video is not playing if you choose to use the "display:none" method.

Answer 3

Another way to do it is to disable the context menu like this:

<video oncontextmenu="return false;" controls>
 <source src="somedir/somevideo.mp4" type="video/mp4"/>
</video>