2016-04-28 61 views
2

我有隨機每隔n秒(根據輸入來自網頁),當用戶點擊開始扮演着不同的音頻文件的功能。正如你所期望的那樣,當它們停止時它會停止。Javascript的setTimeout工作在桌面上,而不是在Android?

它(使用Chrome)作品在我的桌面上夢幻般的,但我已經試過了兩個不同的Android設備(注4和注8)在Chrome,但它只會想逃之前播放音頻一次。

工作流程:用戶點擊啓動,該功能startstop被調用。如果是開始按鈕,則播放音頻並創建n秒超時(加2以允許每個音頻文件播放)

如果是停止按鈕,清除超時,暫停任何音頻並重置按鈕開始。

var audiofiles = ['audio/Are your fingers curved.mp3','audio/Curve fingers.mp3','audio/Curve them up.mp3','audio/Curve them.mp3','audio/Curve your fingers.mp3','audio/Curve.mp3'] 

var playSounds; 
var audio; 

function startstop() 
{  
    var text = document.getElementById("StartStop").firstChild; 
    if (text.innerHTML == 'Start') 
    { 
     if (!validateInputValue()) 
     { 
      return; 
     } 
     playAudio(); 
     text.innerHTML = 'Stop'; 
    } 
    else 
    { 
     clearTimeout(playSounds); 
     audio.pause(); 
     text.innerHTML = 'Start'; 
    } 
} 

function playAudio() 
{ 
    var delta = document.getElementById("timeDelta").value; 
    delta = parseInt(delta, 10) + 2; // add two since they're all about two seconds. Easier than blocking when you play a file. 

    var fileToPlay = audiofiles[Math.round(Math.random() * (audiofiles.length - 1))]; 
    audio = new Audio(fileToPlay); 
    audio.play(); 

    playSounds = setTimeout(playAudio, delta*1000); 
} 

function validateInputValue() 
{ 
    document.getElementById("warning").innerHTML = "   "; 

    //Get the value to evaluate 
    delta = parseInt(document.getElementById("timeDelta").value, 10); 

    if (delta < 0 || delta > 300) 
    { 
     document.getElementById("warning").innerHTML = "Please enter a number from 0 to 300"; 
     document.getElementById("timeDelta").value = 30; 
     return false; 
    } 
    return true; 
} 

我覺得我正在服用瘋狂的藥丸。該網站是現場直播,可以在susannavalleau.com/fingers找到。這是一個愚蠢的web應用程序我正在做我姐姐誰是一個鋼琴老師提醒她的學生曲線自己的手指。

回答

3

這個問題是由大多數移動瀏覽器造成的,它阻止視頻和聲音在沒有用戶交互的情況下播放(根據他們的數據合同,加載它們可能導致用戶的額外費用)

所以你不能一個setTimeout後使用new Audio()。你能做什麼,但是,至少一個用戶交互之後,是替代音頻元素的src,使其發揮。好消息是:您至少需要一次用戶交互。

第一步,在你的HTML添加<audio>元素:

<audio id="sound"></audio> 

2.當頁面加載完成的HTML,保存該元素在audio變量,加入這個在你的代碼的末尾:

window.addEventListener('DOMContentLoaded', function(){ 
    audio = document.getElementById('sound'); 
}); 

在你playAudio功能,替代使用audio = new Audio(),請這樣做:

audio.src = fileToPlay; 
相關問題