使用javascript动态播放多种声音 [英] Dynamically playing multiple sounds using javascript

查看:173
本文介绍了使用javascript动态播放多种声音的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

    var actions = function(){return {whichPattern:"pattern1"}};
    var audio = new Audio();
    var _play = function(){
        var l = pattern[actions().whichPattern].instrument.length,
            times_played =0;
        var p = setInterval(function(){

var x = pattern[actions().whichPattern][times_played];
        for(var i=0; i<x.length;i++){
                var toBePlayed = pattern[actions().whichPattern][times_played][i],
                url= "All Drums sounds/"+toBePlayed+".wav";
                audio.src = url;
                audio.play();
                console.log(audio);
                times_played++;
        }

        }, pattern_config[actions().whichPattern].delay);   
    if(times_played === l){
        clearInterval(p);

    };

    var pp=document.getElementById("play_pause");
    pp.style.background="url('graphics/pause.png') no-repeat";
    pp.style.backgroundSize ="30px 28px"
    audio.source='All Drums sounds/'+pattern['pattern1'][1][0]+'.wav';
    audio.play();

    };

    var pattern_config = {
        pattern1:{
            WP_slotsCounter:0,
            instrument:["Kick_02", "F_T_03", "Rude_cymbal_02"],
                delay:10
        },
    };

    var pattern={
        pattern1: [], // [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']]
    }

上面的代码非常简单.第一个函数返回一个对象...

我的主要动机是:

假设pattern.pattern1 = [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']],那么pattern['pattern1'][0]中的所有字符串应在同一时刻播放,然后延迟patter_config[actions().whichPattern].delay,则具有pattern['pattern1'][1]名称的声音文件应一起播放./p>

所以要实现这一点,我做了上面的功能_play()

好吧,问题在于它没有播放音乐文件,也没有给出任何错误,因此我可以确定问题出在哪里.

解决方案

pattern ["pattern1"]是字符串数组,没有任何"instrument"属性 也许您正在尝试使用pattern_config ["pattern1"]

 var actions = function () {
     return {
         whichPattern: "pattern1"
     }
 };
 var audio = new Audio();
 var _play = function () {
     var l = pattern_config[actions().whichPattern].instrument.length,
         times_played = 0;
     var p = setInterval(function () {

         var x = pattern_config[actions().whichPattern][times_played];
         for (var i = 0; i < x.length; i++) {
             var toBePlayed = pattern_config[actions().whichPattern][times_played][i],
                 url = "All Drums sounds/" + toBePlayed + ".wav";
             audio.src = url;
             audio.play();
             console.log(audio);
             times_played++;
         }

     }, pattern_config[actions().whichPattern].delay);
     if (times_played === l) {
         clearInterval(p);

     };

     var pp = document.getElementById("play_pause");
     pp.style.background = "url('graphics/pause.png') no-repeat";
     pp.style.backgroundSize = "30px 28px"
     audio.source = 'All Drums sounds/' + pattern['pattern1'][1][0] + '.wav';
     audio.play();

 };

 var pattern_config = {
     pattern1: {
         WP_slotsCounter: 0,
         instrument: ["Kick_02", "F_T_03", "Rude_cymbal_02"],
         delay: 10
     },
 };

 var pattern = {
     pattern1: [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']],
 }

    var actions = function(){return {whichPattern:"pattern1"}};
    var audio = new Audio();
    var _play = function(){
        var l = pattern[actions().whichPattern].instrument.length,
            times_played =0;
        var p = setInterval(function(){

var x = pattern[actions().whichPattern][times_played];
        for(var i=0; i<x.length;i++){
                var toBePlayed = pattern[actions().whichPattern][times_played][i],
                url= "All Drums sounds/"+toBePlayed+".wav";
                audio.src = url;
                audio.play();
                console.log(audio);
                times_played++;
        }

        }, pattern_config[actions().whichPattern].delay);   
    if(times_played === l){
        clearInterval(p);

    };

    var pp=document.getElementById("play_pause");
    pp.style.background="url('graphics/pause.png') no-repeat";
    pp.style.backgroundSize ="30px 28px"
    audio.source='All Drums sounds/'+pattern['pattern1'][1][0]+'.wav';
    audio.play();

    };

    var pattern_config = {
        pattern1:{
            WP_slotsCounter:0,
            instrument:["Kick_02", "F_T_03", "Rude_cymbal_02"],
                delay:10
        },
    };

    var pattern={
        pattern1: [], // [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']]
    }

The above code is very simple. The first function return an object ...

well the main motive of mine is like :

assuming that pattern.pattern1 = [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']] so i what that the all the strings in the pattern['pattern1'][0] should play at same instant and then with a delay of patter_config[actions().whichPattern].delay that sound files with that names of pattern['pattern1'][1] should play together.

so to achieve this i made the above function _play()

well the problem is that it is not playing the music files and not giving any errors too so that i can identify where is that problem.

解决方案

pattern["pattern1"] is an array of strings and does not have any 'instrument' property maybe you were trying to use pattern_config["pattern1"]

 var actions = function () {
     return {
         whichPattern: "pattern1"
     }
 };
 var audio = new Audio();
 var _play = function () {
     var l = pattern_config[actions().whichPattern].instrument.length,
         times_played = 0;
     var p = setInterval(function () {

         var x = pattern_config[actions().whichPattern][times_played];
         for (var i = 0; i < x.length; i++) {
             var toBePlayed = pattern_config[actions().whichPattern][times_played][i],
                 url = "All Drums sounds/" + toBePlayed + ".wav";
             audio.src = url;
             audio.play();
             console.log(audio);
             times_played++;
         }

     }, pattern_config[actions().whichPattern].delay);
     if (times_played === l) {
         clearInterval(p);

     };

     var pp = document.getElementById("play_pause");
     pp.style.background = "url('graphics/pause.png') no-repeat";
     pp.style.backgroundSize = "30px 28px"
     audio.source = 'All Drums sounds/' + pattern['pattern1'][1][0] + '.wav';
     audio.play();

 };

 var pattern_config = {
     pattern1: {
         WP_slotsCounter: 0,
         instrument: ["Kick_02", "F_T_03", "Rude_cymbal_02"],
         delay: 10
     },
 };

 var pattern = {
     pattern1: [['asas', 'sf', 'asd'], ['svv','dgh','sdgh']],
 }

这篇关于使用javascript动态播放多种声音的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆