마우스 클릭음이 연속해서 나오지 않는 문제 채택완료
이삼사234
2년 전
조회 4,323
안녕하세요~
다음과 같은 코드를 사용해서 홈페이지에 마우스 클릭음이 나오게 해뒀는데요,
<div onclick="play()"><audio id="audio_play" src="<a href="https://soundeffect-lab.info/sound/button/mp3/cursor12.mp3"></audio> " target="_blank" rel="noopener noreferrer">https://soundeffect-lab.info/sound/button/mp3/cursor12.mp3"></audio> </a>
<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개
채택된 답변
+20 포인트
2년 전
해당 테그에 클릭시에 play() 함수에 이벤트를 정상적으로 호출 하는지를 먼저 확인해보시기 바랍니다.
중간에 console.log("이벤트 넘어옴" ) <-- 요런식으로 로그를 한번 출력해서 대재로 출력되는지 확인해보시면될꺼 같습니다.
로그인 후 평가할 수 있습니다
답변에 대한 댓글 1개
�
이삼사234
2년 전
해당 방법으로 로그를 출력 해 보았는데 로그 출력이 정상적으로 되지 않고 있네요... (연속해서 클릭하면 로그 출력 안 됨) 코드 문제는 아닌 것으로 확인했습니다 감사합니다 ㅠ
댓글을 작성하려면 로그인이 필요합니다.
2년 전
지금 코드는 한번 클릭하는 이벤트에서만 작동하게 됩니다.
그런데 님이 바라는건 더블클릭 이벤트에서도 작동하는거라 보는데...
그러니 더블클릭 이벤트 처리도 해주면 문제는 해결될거 같아요.
<div onclick="play()" ondblclick="dblclick(event)">
<script>
function dblclick(e) {
e.preventDefault();
e.stopPropagation();
e.target.click();
}
</script>
이렇게 ... 도움이 되길!!!
로그인 후 평가할 수 있습니다
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인