首页 > 解决方案 > Console.log 不匹配数组

问题描述

按下乐器声音按钮播放声音。我试图匹配 console.log 上的每个数组元素,但没有工作。

为什么“console.log”匹配数组,有时不匹配?我的意思是,console.log 有时会显示与听到的声音对应的乐器名称,有时会显示错误的名称。第一个“console.log”是唯一与播放的声音匹配的。

   
    let index;
   
    let sounds = ["DB.WAV","CLA.WAV","TBN.WAV","REC.WAV","TRI.WAV"];
    oldSounds = [];

    let playSounds = function () {
    index = Math.floor(Math.random() * sounds.length);
     
        thisSound = sounds[index];

        oldSounds.push(thisSound);
        sounds.splice(index, 1);

        if (sounds.length < 1) {
            sounds = oldSounds.splice(0, oldSounds.length);
        }

  $("#element").html("<audio autoplay><source src=\"" + thisSound + "\" type=\"audio/mpeg\"><embed src=\"" + thisSound + "\" hidden=\"true\" autostart=\"true\" /></audio>"); 
    
    
        
            if(index === 0) {
             console.log(`Double Bass`);
        } else if(index === 1) {
            console.log(`Clarinet`);
        }else if(index === 2) {
            console.log(`Trombone`);
        }else if(index === 3) {
            console.log(`Recorder`);
        }else if(index === 4) {
            console.log(`Triangle`);}
}
</script>
<div class="wrapper clearfix">
        <div class="player-panel">
                
                 <button class="btn-answer"><i class="ion-ios-download-outline"></i>Answer</button>
            <div onclick="playSounds()">
                <button class="btn-play"><i class="far fa-play-circle"></i>Instrument Sound</button>
            </div>
                <input type="text" placeholder="Instrument name" class="instrument">
                <div id="element"></div>
       </div>
</div>

标签: arraysaudioconsole.log

解决方案


我想我终于明白了!!!

<html>
    <head>
        <title>lkl</title>
    </head>
    <body>

        <div class="wrapper clearfix">
            <div class="player-panel">
                    
                <button class="btn-answer"><i class="ion-ios-download-outline"></i>Answer</button>
                
                <div onclick="playSounds()">
                    <button class="btn-play"><i class="far fa-play-circle"></i>Instrument Sound</button>
                </div>
                
                <input type="text" placeholder="Instrument name" class="instrument">
                <div id="element"></div>
           </div>
        </div>

    <script>         
    let index;
    let sounds = ["DB.WAV","CLA.WAV","TBN.WAV","REC.WAV","TRI.WAV"];
    oldSounds = [];

    let playSounds = function () {
        index = Math.floor(Math.random() * sounds.length);
        
        console.log(sounds[index]);

        if(index == sounds.indexOf('DB.WAV')) {
            console.log(`Double Bass`);
        } else if(index == sounds.indexOf('CLA.WAV')) {
            console.log(`Clarinet`);
        }else if(index == sounds.indexOf('TBN.WAV')) {
            console.log(`Trombone`);
        }else if(index == sounds.indexOf('REC.WAV')) {
            console.log(`Recorder`);
        }else if(index == sounds.indexOf('TRI.WAV')) {
            console.log(`Triangle`);
        }


        thisSound = sounds[index];

        oldSounds.push(thisSound);
        sounds.splice(index, 1);

        //checking if the code of avobe is working
        console.log(oldSounds);
        console.log(sounds);

        if (sounds.length < 1) {
            sounds = oldSounds.splice(0, oldSounds.length);
        }
    }


    
      </script>
    </body>
</html>

如果这不是你所期望的,请告诉我。

$("#element").html("<audio autoplay><source src=\"" + thisSound + "\" type=\"audio/mpeg\"><embed src=\"" + thisSound + "\" hidden=\"true\" autostart=\"true\" /></audio>"); 我要删除它的行,因为它给了我一个错误。把它贴回去就可以了(我希望xd)

(顺便说一句,代码仅在按下乐器声音按钮时运行(我已经这样理解了(如果没有,请告诉我,我会尝试修复它))


推荐阅读