javascript - JavaScript单击函数播放mp3,而不循环

标签 javascript jquery html audio

我想创建一系列函数,这些函数存储单击时将播放的mp3文件。例如。我想说,单击#3播放某种声音或mp3,然后单击#5等,依此类推。

    var a1_Events = [newsound1, newcoolersound2, coolestsound3],
        a1_c = 0;

        function newsound1(){

        // I would like to trigger a mp3 here. But not loop.
}

        function newcoolersound2(){

        // I would like to trigger a mp3 here. But not loop.
}

        function coolestsound3(){

        // I would like to trigger a mp3 here. But not loop.
}

    $('#area1').click(function(){
       a1_Events[a1_c++ % a1_Events.length]();
    });

更新:

好吧,我想我有一个解决方案。但是看起来有点笨重-希望有更好的东西;但是我的实现计划是将以下内容嵌套在div中,并通过上面的功能区域中的show / hide onClick显示按钮。
//mp3 File 1
<audio id="id1" src="01.mp3"></audio>
<button onClick="document.getElementById("id1").play()">Play</button>
<button onClick="document.getElementById("id1").pause()">Stop</button>

最佳答案

所以这是我以前的做法:

document.getElementById("sound").innerHTML=
  "<embed src=\"ding.wav\" hidden=\"true\" autostart=\"true\" loop=\"false\" ><source src=\"ding.ogg\"><source src=\"ding.mp3\"><source src=\"ding.aac\"></embed>";

您可以放置​​任何格式的文件(请注意,某些浏览器不支持某种格式)。另一种选择是将该代码放置在“div”元素中,然后在播放声音后将其删除。

关于javascript - JavaScript单击函数播放mp3,而不循环,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17432586/

相关文章:

javascript - 如何在@click 上更新模板

javascript - jQuery/Javascript : scrollTop Value in all browsers?

javascript - 解决方案 Bootstrap 表单验证

javascript - alertify.js - rails 自定义确认对话框

javascript - 检查当前页面 Angular 中的所有条目

html - flex 元素不包装

javascript - 是否可以像 Highcharts 一样在 NVD3 图表中使用缩放选项?

javascript - 可调整大小的 jQuery 在 Angular JS 中不起作用

javascript - 如果子元素名称与 location.hash 匹配,则突出显示 div

html - 无法使标题位于页面顶部