HTML 참조 가이드

HTML 태그 전체 목록

HTML 오디오/비디오 DOM ratechange 이벤트

更改播放速率后，将触发ratechange事件。

在线示例

更改视频的播放速度,并提醒速度已更改：

示例

!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 音频/视频 onratechange 事件使用-基础教程(oldtoolbag.com)</title>
</head>
<body>
<p>이 예제에서는 HTML DOM을 사용하여 video 요소에 "onratechange" 이벤트를 추가했습니다. playbackRate 속성은 비디오 재생 속도를 변경하는 데 사용됩니다.</p>
<video id="myVideo" width="320" height="176" autoplay controls>
　　<source src="mov_bbb.mp4" type="video/mp4">
　　<source src="mov_bbb.ogg" type="video/ogg">
　　您的浏览器不支持 HTML5　video 태그
</video>
<br>
<button onclick="setPlaySpeed()" type="button">비디오 느리게 재생 설정</button>
<script>
//　id="myVideo"의 <video> 요소를 가져옵니다
var vid = document.getElementById("myVideo");
//　비디오 재생 속도를 0으로 설정합니다.3　(느리게)
function setPlaySpeed()　
{　
　　　　vid.playbackRate = 0.3;
}　
//　비디오 재생 속도가 변경될 때 함수를 실행하도록 <video>에 ratechange 이벤트를 추가합니다. 함수는 텍스트 메시지를 표시합니다.
vid.onratechange = function()　
{
　　　　myFunction()
};
function myFunction()　
{
　　　　alert("onratechange 이벤트가 트리거됨　-　비디오 재생 속도가 변경되었습니다");
}
</script>　
</body>
</html>

테스트를 보세요 ‹/›

정의와 사용법

오디오를 변경할 때/비디오의 재생 속도가 변경될 때(예를 들어, 사용자가 슬로우 모드나 전진 모드로 전환할 때) ratechange 이벤트가 발생합니다.
이 이벤트는 “음성/비디오 객체”의playbackRate속성 호출, 이 속성은 오디오/비디오의 현재 재생 속도.

브라우저 호환성

IEFirefoxOperaChromeSafari

문법

HTML에서:

<audio|video onratechange="myScript">시도해 보세요

JavaScript에서:

audio|video.onratechange=function(){myScript};시도해 보세요

JavaScript에서, addEventListener() 메서드를 사용하여:

audio|video.addEventListener("ratechange", myScript);시도해 보세요

주의: Internet Explorer 8 및 이전 IE 버전은 지원하지 않습니다 addEventListener() 메서드.

기술 세부 사항

지원되는 HTML 태그:	<audio>과 <video>
지원되는 JavaScript 객체:	오디오, 비디오

HTML 오디오/비디오 DOM 참조 설명서

HTML: <template> 태그