我正在尝试在我的网站上制作一架钢琴,出于某种原因,每当我单击一个音符两次时,第二次似乎总是从第一次开始继续(假设我没有持有它整个音频文件(。我如何做到这一点,以便当我多次单击一个音符时,音频文件每次都会重新启动(请记住,我是 JavaScript 的新手(。
var C3 = new Audio();
C3.src = "assets/music/C3.mp3";
div.w{
height: 282px;
width: 59px;
position: absolute;
border-style:solid;
border-width:3px;
}
div.b{
height: 141px;
width: 29.5px;
position: absolute;
background-color: #000000;
}
<div class="w" id="C3" type="button"
onmousedown="C3.play();document.getElementById('C3').style.backgroundColor='#cecece'"
onmouseup="C3.pause();document.getElementById('C3').style.backgroundColor='#ffffff'"
onmouseleave="C3.pause();document.getElementById('C3').style.backgroundColor='#ffffff'">
</div>
您需要将currentTime
重置为0
:
var C3 = new Audio();
C3.src = "http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.oga";
div.w{
height: 282px;
width: 59px;
position: absolute;
border-style:solid;
border-width:3px;
}
div.b{
height: 141px;
width: 29.5px;
position: absolute;
background-color: #000000;
}
<div class="w" id="C3" type="button"
onmousedown="C3.play();document.getElementById('C3').style.backgroundColor='#cecece'"
onmouseup="C3.pause();C3.currentTime = 0;document.getElementById('C3').style.backgroundColor='#ffffff'"
>
</div>