English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
검색 작업이 완료되고 현재 재생 위치가 변경되고 부울 검색 속성이 false로 변경되면, 검색 이벤트가 발생합니다。
사용자가 이동을 완료할 때/비디오 내의 새 위치로跳跃 후, 일부 텍스트를 알려주세요：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 오디오/비디오 onseeked 이벤트 사용-기본 강의(oldtoolbag.com)</title>/title>
</head>
<body>
<p>비디오 재생 위치를 이동하세요</p>
<video id="myVideo" width="320" height="176" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
브라우저에서 HTML을 지원하지 않습니다5 video 태그
</video>
<script>
var vid = document.getElementById("myVideo");
vid.onseeked = function()
{
alert("주소 작업이 완료되었습니다!");
};
</script>
</body>
</html>테스트를 보세요.‹/›사용자가 이동을 완료할 때/오디오로跳跃/비디오 내의 새 위치로 이동할 때, 검색 이벤트가 발생합니다。
주의: seeked 이벤트의 반대 이벤트는seeking 이벤트.
주의: Audio를 사용하여/Video 객체의 currentTime 속성을 사용하여 비디오 재생 위치를 얻을 수 있습니다。
IEFirefoxOperaChromeSafari
HTML에서：
<audio|video onseeked="myScript">테스트해 보세요
JavaScript에서：
audio|video.onseeked=function(){myScript};테스트해 보세요
JavaScript에서, addEventListener() 메서드를 사용하여:
audio|video.addEventListener("seeked", myScript);테스트해 보세요
주의: Internet Explorer 8 및 이전 IE 버전은 지원하지 않습니다 addEventListener() 메서드.
기술 세부 사항| 지원하는 HTML 태그: | <audio>과 <video> |
|---|---|
| 지원하는 JavaScript 객체: | Audio, Video |
이 예제는 seeking 事件와 seeked 事件的区别:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 오디오/비디오 onseeked 이벤트 사용-기본 강의(oldtoolbag.com)</title>/title>
</head>
<body>
<p>이 예제는 seeking 이벤트와 seeked 이벤트의 차이를 보여줍니다:</p>
<p> seeking 이벤트가 사용자가 이동을 시작할 때마다 발생합니다。</비디오 오디오跳跃（ audio/video）가 새 위치로 이동할 때 발생합니다。 </p>
<p> seeked 이벤트가 사용자가 이동을 완료할 때 발생합니다。</비디오 오디오跳跃（ audio/video）가 새 위치로 이동할 때 발생합니다。</p>
<p>비디오 재생 위치를 이동하세요。 <strong>주의：</강조> 마우스 버튼을 설치하고 비디오 재생을 오가게 하세요.</p>
<video onseeking="myFunction()" onseeked="mySecondFunction()" width="320" height="176" controls>
<source src="mov_bbb.mp4" type="video/mp4">
<source src="mov_bbb.ogg" type="video/ogg">
브라우저에서 HTML을 지원하지 않습니다5 video 태그
</video>
<p>seeking 트리거: <span id="demo"></span>회.</p>
<p>seeked 트리거: <span id="demo2></span>회.</p>
<script>
x = 0;
function myFunction()
{
document.getElementById("demo").innerHTML = x += 1;
}
y = 0;
function mySecondFunction()
{
document.getElementById("demo2").innerHTML = y += 1;
}
</script>
</body>
</html>테스트를 보세요.‹/›사용자가 이동을 완료한 후/새로운 비디오 위치로 이동할 때, Video 객체의 currentTime 속성을 사용하여 현재 재생 위치를 표시합니다:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 오디오/비디오 onseeked 이벤트 사용-기본 강의(oldtoolbag.com)</title>/title>
</head>
<body>
<p>이 예제에서는 video 요소에 "seeked" 이벤트를 추가했습니다. currentTime 속성은 현재 재생 위치를 반환합니다.</p>
<p>비디오에서 새로운 위치로 이동하세요.</p>
<video id="myVideo" width="320" height="176" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
브라우저에서 HTML을 지원하지 않습니다5 video 태그
</video>
<p>탐색 위치: <span id="demo"></span></p>
<script>
// id="myVideo"의 video를 가져옵니다
var vid = document.getElementById("myVideo");
// video에 "seeked" 이벤트를 추가하여, 탐색 작업이 완료되면 함수를 실행합니다
vid.addEventListener("seeked", myFunction);
function myFunction()
{
// id="demo"의 p 요소에 video의 현재 재생 위치를 표시합니다
document.getElementById("demo").innerHTML = vid.currentTime;
}
</script>
</body>
</html>테스트를 보세요.‹/›사용자가 이동을 완료한 후/오디오의 새로운 재생 위치로 이동할 때 팝업 메시지가 표시됩니다：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML 오디오/비디오 onseeked 이벤트 사용-기본 강의(oldtoolbag.com)</title>/title>
</head>
<body>
<p>오디오의 재생 위치를 이동하려면</p>
<audio id="myAudio" controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
귀하의 브라우저는 audio 요소를 지원하지 않습니다.
</audio>
<script>
var aud = document.getElementById("myAudio");
aud.onseeked = function()
{
alert("주소 작업이 완료되었습니다!");
};
</script>
</body>
</html>테스트를 보세요.‹/›