English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
The play event will be triggered when playback starts.
HTML Audio/Video DOM Reference Manual
Popup a prompt message when the video starts playing:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML Audio</title>/Usage of video onplay event-Basic Tutorial(oldtoolbag.com)</title>/title>
</head>
<body>
<p>Press the play button.</p>
<video id="myVideo" width="320" height="176" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support HTML5 video tag.
</video>
<script>
var vid = document.getElementById("myVideo");
vid.onplay = function()
{
alert("The video has started playing");
};
</script>
</body>
</html>Test to see ‹/›The play event is triggered in the audio/Video(audio/Triggered when the video (audio) starts playback.
Hint: pause Event is triggered in the audio/Video(audio/Triggered when the video (audio) pauses playback.
IEFirefoxOperaChromeSafari
In HTML:
<audio|video onplay="myScript">Try it out
In JavaScript, use the addEventListener() method:
audio|video.addEventListener("play", myScript);Try it out
Note: Internet Explorer 8 and earlier IE versions do not support addEventListener() Methods.
Technical Details| Supported HTML Tags: | <audio> and <video> |
|---|---|
| Supported JavaScript Objects: | Audio, Video |
Popup a prompt message when the audio starts playing:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML Audio</title>/Video play event usage-Basic Tutorial(oldtoolbag.com)</title>/title>
</head>
<body>
<p>Press the play button.</p>
<audio id="myAudio" controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
<script>
var aud = document.getElementById("myAudio");
aud.onplay = function()
{
alert("The audio has started playing");
};
</script>
</body>
</html>Test to see ‹/›