2016-04-28 5 views
2

私は、ユーザーがstartを押すと、(Webページからの入力に基づいて)n秒ごとにランダムに異なるオーディオファイルを再生する機能を持っています。あなたが期待していたように、彼らは停止を押すと停止します。JavascriptのsetTimeoutは、Androidではなく、デスクトップで動作しますか?

私のデスクトップでは(クロムを使用して)幻想的ですが、クロームでは2つの異なるアンドロイドデバイス(ノート4とノート8)で試しましたが、オーディオを再生する前に一度だけ再生します。

ワークフロー:ユーザーが開始をクリックすると、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で見つけることができます。それは私の妹がピアノの先生で、自分の指を曲げるように思い出させる愚かなウェブアプリです。

答えて

3

この問題は、ほとんどのモバイルブラウザでは、ユーザーの操作なしでビデオとサウンドが再生されないようにブロックされています。(ロードすると、データ契約によってユーザーに余分なコストがかかることがあります)

setTimeoutの後にnew Audio()を使用することはできません。ただし、少なくとも1人のユーザーのやりとり後にできることは、オーディオ要素のsrcを置き換えて再生させることです。良いニュースは、既に少なくとも1つのユーザー対話が必要であることです。

1.まずステップ、あなたのHTML内<audio>要素を追加:ページはHTMLを読み込むに行われた場合、これを追加することにより、audio変数にその要素を保存し、

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

2.をあなたのコードの末尾:あなたのplayAudio機能で

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

3.、中audio = new Audio()を使用する代わりに、次のようにしてください:

audio.src = fileToPlay; 
関連する問題