当按下播放时,文件。mp3应该播放,当再次点击。mp3应该停止并重置音频。
如果在声音已经播放时按下另一个播放按钮,则应该停止音频,将其时间重置为0,并播放新音频。
目标是一次只播放一个声音,这样声音就不会重叠,同时从'key'获取文件名,并在javascript/jquery中添加目录+ .mp3后。
此方法的主要目的是防止用户右键单击"另存为"而模糊mp3位置。
由于某些原因它不工作
<span class="play" key="cef83b993c716dd543b6fa4f053cc4a4">Play</span>
<br>
<span class="play" key="7a5c5d3940f65d81489a0c18f877114b">Play</span>
<script>
var currentAudio = null;
$(".play").click(function () {
if(currentAudio != null && !currentAudio.paused && currentAudio != this){
currentAudio.pause();
currentAudio.currentTime = 0;
$( this ).removeClass( "pause" );
$( this ).addClass( "play" ); // switch to play button
}
var audio = ("beats/" + $(this).attr('key') + ".mp3");
if (audio.paused) {
audio.play();
currentAudio = audio;
$( this ).addClass( "pause" ); // switch to pause button
} else {
audio.pause();
$( this ).removeClass( "pause" );
$( this ).addClass( "play" ); // switch to play button
}
});
</script>
我想象的是这样的:
$(".play").on('click',function(){
var key = $(this).attr('key');
EvalSound(key);
});
var thissound = new Audio();
var currentKey;
function EvalSound(key) {
if(currentKey !== key)
thissound.src = "http://designlab360.org/fhi/splash/dev2/audio/" + key + ".mp3";
currentKey = key;
if (thissound.paused)
thissound.play();
else
thissound.pause();
thissound.currentTime = 0;
currentPlayer = thissound;
}
见http://jsfiddle.net/sjmcpherso/pt3cx1eo/11/