【问题标题】:I can't restart my audio file我无法重新启动我的音频文件
【发布时间】:2018-06-12 09:39:23
【问题描述】:

我正在尝试在我的网站上制作钢琴,出于某种原因,每当我点击一个音符两次时,第二次似乎总是从第一次继续(假设我没有完全按住它)音频文件的长度)。如何做到这一点,以便当我多次单击一个音符时,音频文件每次都会重新启动(请记住,我是 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>

【问题讨论】:

  • 我自己对 Audio 对象并不太熟悉,但看起来这是因为您正在暂停音频而不是返回开始。也许此链接可能会有所帮助:developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/… 我认为您需要暂停音频,然后将 fastSeek 设置为 0。
  • Sooo 解决了你的问题@DylanCatterall
  • 是的,感谢您的帮助

标签: javascript audio refresh restart piano


【解决方案1】:

您需要将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>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-01-29
    • 1970-01-01
    • 2012-06-24
    • 1970-01-01
    • 1970-01-01
    • 2019-04-29
    • 2021-08-05
    相关资源
    最近更新 更多