如何根据用户的选择标签设置音频阵列的持续时间

时间:2017-08-02 17:16:26

标签: javascript jquery html5

我正在尝试让我的代码播放音频文件数组但是当我的索引i = 4时,持续时间将取决于用户的选择标记。我厌倦了通过选择名称捕获用户的选项并乘以100(因为它是毫秒)。我的程序显示它未定义。为什么?

在第一轮播放整个阵列后,我的代码将重复播放阵列播放列表元素3到5中的音频,但它是随机选择的。我正在考虑使用随机种子从3到5中选择元素。但这涉及到数学。我该怎么做呢?

谢谢你的帮助。我很感激

<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>
            <option value="8">8</option>
            <option value="9">9</option>
            <option value="10">10</option>
        </select>
    <br>
    <br>
    <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 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"
    }, {
        "duration": document.getElementById("secFollowUp").value * 1000,
        "key": "4_tell_me_a_story"
    }, {
        "duration": document.getElementById("secFollowUp").value * 1000,
        "key": "5_and_then_what"
    }];

  var i = 0;

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

        function playAudio() {
            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){

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

                $("#numFollowUp").change(function(){
                    $(this).val() = repeat;
                });
            }
        }

1 个答案:

答案 0 :(得分:1)

那是因为document.getElementsByName("secFollowUp")返回NodeList而不是特定元素。

因此,如果secFollowUp确实是输入元素的名称(,并且您希望使用getElementsByName方法访问它),则必须使用document.getElementsByName("secFollowUp")[0].value注意[0]以获取NodeList的第一个元素

如果是id元素的input,则使用document.getElementById('secFollowUp').value

<强> 更新
如果没有注意到你帖子中的实际html,两个解决方案都会有效,但第二个更好(使用getElementById