Google Chrome、audio、setTimeout、オーディオsrcを置き換え、中音域を再起動

Question

これはChromeの問題で、他のブラウザで正常に動作します。

私はウェルカムメッセージを再生するスピーカーをクリックします。ウェルカムメッセージが終了していない場合は、終了するまでチェックを続けてから、ソースを別のメッセージに変更します。私は、新しいメッセージを聞くために、再度スピーカーをクリックすると

は、このメッセージが起動し、数秒後に停止し、再び開始し、その後、停止します（私の推定値は、そのメッセージの期間が渡されたとき、それが停止していることである）

私のJavaScriptで

<audio id="shop_audio" preload="auto" type="audio/mpeg" src="/audios/helper/shop/en/welcome.mp3"></audio> 
<p id="shop_speaker"> 
    <i class="fa fa-volume-up"></i> 
</p> 

：私のHTMLで

準備

ドク：

$("#shop_speaker").click(function(){ 
    document.getElementById("shop_audio").play(); 
}); 

その後

：

$(window).load(function(){ 
    sl.utils.t_shopInstructions = setTimeout(sl.shop.audio.setAudio, 5000, 0); 
}); 

そして：

sl.shop.audio={ 
    setAudio: function(which){ 
     clearTimeout(sl.utils.t_shopInstructions); 
     var audio = document.getElementById("shop_audio"); 
     if(audio.paused==true){ 
      sl.shop.audio.newSrc(which); 
     }else{ 
      sl.utils.t_shopAudioPlaying = setInterval(sl.shop.audio.waitForPaused, 500, which); 
     } 
    }, 
    waitForPaused: function(which){ 
     if(document.getElementById("shop_audio").paused==true){ 
      clearInterval(sl.utils.t_shopAudioPlaying); 
      sl.shop.audio.newSrc(which); 
     } 
    }, 
    newSrc: function(which){ 
     document.getElementById("shop_audio").src = '/audios/helper/shop/en/help_instruction_'+which+'.mp3'; 
    } 
} 

もクロムを除いて、どこでも動作しますバリアント： は（私がしたsetIntervalがトラブルを起こしていたことを考え、および/またはそのクリア）

sl.shop.audio={ 
    setAudio: function(which){ 
     clearTimeout(sl.utils.t_shopInstructions); 
     var audio = document.getElementById("shop_audio"); 
     if(audio.paused==true){ 
      sl.shop.audio.newSrc(which); 
     }else{ 
      (function looping(){ 
       clearTimeout(sl.utils.t_shopAudioPlaying); 
       if(audio.paused==false){ 
        sl.utils.t_shopAudioPlaying=setTimeout(looping, 500); 
       }else{ 
        sl.shop.audio.newSrc(which); 
       } 
      })() 
     } 
    }, 
    newSrc: function(which){ 
     document.getElementById("shop_audio").src = '/audios/helper/shop/en/help_instruction_'+which+'.mp3'; 
    } 
} 

clearTimeout()を別の場所に配置すると違いがあるので、私はそれを追求しましたが、結果は一貫していません。

私は今、すべてのclearTimeoutsを削除しました。何も違いはありません。問題はまったく同じです。

お寄せいただきありがとうございます！

Answer 1

歓迎 メッセージが終了していない場合、私は歓迎のメッセージを再生するスピーカーをクリックして、私はそれが終了するまで、私は別のメッセージにソースを変更 チェックしておきます。

setTimeoutの代わりにendedイベントを使用できます。 jQueryを使用しているので、.click()の代わりに.one()を使用してください。

var audio = $("#shop_audio")[0]; 
var speaker = $("#shop_speaker"); 

function resetAudio() { 
    audio.play(); 
    audio.onended = function() { 
     this.onended = null; 
     this.src = "/path/to/a/different/src"; 
     speaker.one("click", resetAudio); 
    } 
} 

speaker.one("click", resetAudio);