播放音乐javascript

我的代码如下。基本上，我的目标是一旦用户点击某个按钮，我会得到这个按钮的id并通过ajax发送，然后根据指定的id返回mp3 url并播放声音。一切工作都很好，但问题是我不知道如何停止或暂停音乐。我试过audio.stop()或audio.pause()。两人都没有工作。播放音乐javascript

一旦用户点击某个按钮，我想停止所有音乐并播放点击的新音乐。

$('.play_sound').click(function(event){ 
event.preventDefault(); 
var data_id = $(this).parents('tr').attr('data-id'); 

    $.post('ajax/play_sound.php', {data_id: data_id}, function(data){ 
    var audio = new Audio(data); 
    audio.play(); 
    }); 

});

来源

2014-10-01 Kuwame Brown

您使用的是HTML音频还是插件？ – carlodurso 2014-10-01 02:43:11

我只是用HTML – 2014-10-01 02:44:42

因为您创建audio作为匿名函数范围内的局部变量，所以不能暂停它。

最简单的解决方案是使audio全局。

如果您计划支持多个音频对象，更好的方法是创建一个像AudioPool这样的对象，并且还可以添加“结束”之类的事件。

var audio; 

$('.pause_sound').click(function(event){ 
    event.preventDefault(); 
    if (!audio.paused) { 
    audio.pause(); 
    } 
}); 


$('.stop_sound').click(function(event){ 
    event.preventDefault(); 
    audio.stop(); 
}); 

$('.play_sound').click(function(event){ 
event.preventDefault(); 
var data_id = $(this).parents('tr').attr('data-id'); 

    $.post('ajax/play_sound.php', {data_id: data_id}, function(data){ 
    // audio of global scope 
    audio = new Audio(data); 
    audio.play(); 
    }); 

});

carlodurso建议替代解决方案查询DOM并为audio创建一个HTML元素。

来源

2014-10-01 13:36:11 pce

作品像魅力谢谢！ – 2014-10-02 20:54:12

你应该创建一个音频标签

<audio src="audio.mp3" id="audio"></audio>

然后

document.getElementById('audio').pause(); 

$.post('ajax/play_sound.php', {data_id: data_id}, function(data){ 
    document.getElementById('audio').src = data; 
    document.getElementById('audio').play(); 
});

没有测试，希望它炒菜锅。

来源

2014-10-01 03:30:52 carlodurso

播放音乐javascript

回答

相关问题