Javascriptが要素のarraylistをプレイしていないとき、どうやって来ますか？

Question

私は本当に特定のインデックスの後にランダムにオーディオリストを再生することに固執しています。私は自分のプログラムをインデックス0（ボタンをクリックした後）から順に再生させようとしています。インデックスが4に増えると、配列要素4は再生されますが、再生時間の時間は、document.getElementByIdを使用して行った再生ボタンをクリックする前のユーザーの選択に依存します。そしてインデックスi = 5のとき、私はプログラムがランダムに5から8の要素を選んでそれを再生させたいと思っています。継続時間は、（再生ボタンをクリックする前の）最初の場所でのユーザーの選択に依存します。

これまでのコードは以下のとおりです。動いていない。私は4までインクリメントすると無作為に要素を再生し始めます。私はちょうどその全体のプログラムを実行するために1つのスレッドであるJavaScriptを読んでいます。そうです、この問題をどのように処理すべきですか？

ありがとうございました。私はそれを多く感謝します。

注：numFollowUpQuest変数は、ユーザーが質問をしたい回数です。

var intro_playList = [{ 
     "duration": 1000, 
     "key": "0_silence" 
    }, { 
     "duration": 500, 
     "key": "1_hello" 
    }, { 
     "duration": 1000, 
     "key": "2_how_old" 
    }, { 
     "duration": 1000, 
     "key": "3_what_did_you_make" 
    }, { 
     // story_playlist 
     "duration": 1000, 
     //"duration": document.getElementById("secFollowUp").value * 1000, 
     "key": "4_tell_me_a_story" 
    }, { 
     "duration": 1000, 
     //"duration": document.getElementById("secFollowUp").value * 1000, 
     "key": "5_and_then_what" 
    }, { 
     "duration": 1000, 
     "key": "6_why" 
    }]; 

<select id="numFollowUp" name="numFollowUp" style=display:none> 
      <option value="">Number of follow-up questions</option> 
      <option value="4">4</option> 
      <option value="5">5</option> 
      <option value="6">6</option> 
      <option value="7">7</option> 
</select> 
<select id="secFollowUp" name="secFollowUp" style=display:none> 
      <option value="">Second between each question</option> 
      <option value="10">10</option> 
      <option value="11">11</option> 
      <option value="12">12</option> 
      <option value="13">13</option> 
      <option value="14">14</option> 
      <option value="15">15</option> 
</select> 

var audioElement = document.createElement('audio');   
    audioElement.addEventListener("ended", playAudio); 
    var i = 0; 

$("#play").on("click", playAudio); 

     function playAudio() { 
      console.log(i); 
      var audioIndex = intro_playList[i++]; 
      console.log(audioIndex); 
      console.log("After " + audioIndex.duration + " seconds play next audio"); 

      audioElement.src = "sound/" + audioIndex.key + ".wav"; 
      audioElement.load(); 
      setTimeout(function() { audioElement.play()}, audioIndex.duration); 

      if(i === 4){ 
       intro_playList[i].duration = document.getElementById("secFollowUp").value * 1000; 

       audioElement.src = "sound/" + audioIndex.key + ".wav"; 
       audioElement.load(); 
       console.log(audioElement); 
       setTimeout(function(){ audioElement.play()}, audioIndex.duration); 
      } else if(i >= 5){ 
       intro_playList[i].duration = document.getElementById("secFollowUp").value * 1000; 
       audioElement.src = "sound/" + audioIndex.key + ".wav"; 
       audioElement.load(); 
       setTimeout(function() { audioElement.play()}, audioIndex.duration); 

       // Start randomly picking 
       var numFollowUpQuest = document.getElementById("numFollowUp").value; 

       for(numFollowUpQuest; numFollowUpQuest >= 1; numFollowUpQuest--){ 

        var randomInt = Math.floor(Math.random() * ((8 - 4) + 1) + 4); 
        console.log("randomInt is " + randomInt);       
        audioElement.src = "sound/" + intro_playList[randomInt].key + ".wav"; 

        console.log(audioElement); 
        audioElement.load(); 
        setTimeout(function() { audioElement.play()}, audioIndex.duration); 
       } 
      } 
}; 

Answer 1

あなたの問題は、おそらくあなたのplayAudio機能では、この行です：

は

console.log(i); // i === 0 
var audioIndex = intro_playList[i++]; // i === 1 

インクリメント演算子++はそうi++

i = i + 1; 

すべてに相当し、場所にそのオペランドを修正その機能でのその後の使用はiですコンソールに記録されているものより1つ多い。したがってiは事実上0にならないでしょう。コンソールに4が表示されていれば、実際には何もしないうちに5を得ています。