마우스 클릭음이 연속해서 나오지 않는 문제 채택완료
안녕하세요~
다음과 같은 코드를 사용해서 홈페이지에 마우스 클릭음이 나오게 해뒀는데요,
<div onclick="play()"><audio id="audio_play" src="https://soundeffect-lab.info/sound/button/mp3/cursor12.mp3"></audio>
<script type="text/javascript">
function play() {
var audio = document.getElementById('audio_play');
audio.volume = 0.5;
if (audio.paused) {
audio.play();
}else{
audio.pause();
audio.currentTime = 0
audio.play();
}
}
</script>
마우스를 연속해서 다다다닥 클릭하면 클릭음이 나오지를 않습니다 ㅠㅠ
0.5초정도 간격을 두고 마우스를 클릭하면 잘 작동하구요.
0.5초보다 빠르게 클릭하면 아예 아무 소리도 들리지 않습니다.
뭐가 문제일까요?
답변 3개
해당 테그에 클릭시에 play() 함수에 이벤트를 정상적으로 호출 하는지를 먼저 확인해보시기 바랍니다.
중간에 console.log("이벤트 넘어옴" ) <-- 요런식으로 로그를 한번 출력해서 대재로 출력되는지 확인해보시면될꺼 같습니다.
답변에 대한 댓글 1개
이삼사234댓글을 작성하려면 로그인이 필요합니다.
지금 코드는 한번 클릭하는 이벤트에서만 작동하게 됩니다.
그런데 님이 바라는건 더블클릭 이벤트에서도 작동하는거라 보는데...
그러니 더블클릭 이벤트 처리도 해주면 문제는 해결될거 같아요.
<div onclick="play()" ondblclick="dblclick(event)">
<script>
function dblclick(e) {
e.preventDefault();
e.stopPropagation();
e.target.click();
}
</script>
이렇게 ... 도움이 되길!!!
댓글을 작성하려면 로그인이 필요합니다.
mp3 파일을 로딩하는데 시간이 걸릴 수 있을 것입니다.
wav 파일로 변환해서 사용해 보세요..
답변에 대한 댓글 1개
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인