2015-02-09 187 views
0

爲了響應某些鼠標事件,我只想一次播放一個音頻。在不同的HTML元素播放音頻的情況下,事件會發生。當用戶將鼠標從一個元素快速移動到另一個元素並且元素都播放音頻時,它變得很嘈雜。我想在播放新音頻之前檢查是否播放了任何音頻。我使用以下代碼:停止播放新音頻

var $audioAnno=0; 
function audioAnnotation(y){ 
    var audio; 
    if ($audioAnno==0){ 
     $audioAnno=1; 
     audio = new Audio(y); 
     audio.play(); 
     $audioAnno=0; 
    } 
} 

它不會停止播放第二個音頻。

回答

0

這是怎麼了,我會做到這一點,保持一個標誌canPlay和鼠標事件,如果屬實,那麼玩

canPlay = true; 
var es = document.getElementsByTagName('audio'), audios=[]; 
for(var i=0;i<es.length;i++) audios.push(es[i]); 
audios.forEach(function(e){ 
    e.addEventListener('play', function(){ 
     canPlay= false; 
    }); 

    e.addEventListener('ended', function(){ 
     canPlay= true; 
    }); 
}); 

// later on some mouseEvent based on some condition 

function onMouseEvent(audioElement){ 
    if(canPlay){ 
     audioElement.play(); 
    } 
}; 

編輯:fiddle demo.

EDIT2:

相同只有音頻對象的東西:

var audio = new Audio(), canPlay = true; 
audio.src = 'http://upload.wikimedia.org/wikipedia/en/f/f9/Beatles_eleanor_rigby.ogg'; 
audio.addEventListener('play', function(){ 
    console.log('playing'); 
    canPlay = false; 
}); 
audio.addEventListener('ended', function(){ 
    console.log('stopped'); 
    canPlay = true; 
}); 
audio.play(); 


//similar mouse event listener changes to 
function onMouseEvent(){ 
    if(canPlay){ 
     //audio.src ='...'; // providing new source 
     audio.play(); 
    } 
}; 
+0

感謝modi爲您的快速回復。我是偶爾的JavaScript開發人員。所以不是很熟悉所有功能。我正在使用JavaScript Audio對象。我沒有使用HTML音頻標籤。如何在這種情況下應用你的概念。 – Asif 2015-02-09 06:48:22

+0

@Asif更新了答案。現在檢查。 – mido 2015-02-09 07:01:47

0

謝謝大家。

我可以解決這個問題。我使用以下代碼:

var $audioAnno=0; 
function audioAnnotation(x, y){ 
    var audio = new Audio(y); 
    if ($audioAnno==0){ 
     $audioAnno = 1; 
     audio.play(); 
     audio.addEventListener("ended", function(){ $audioAnno = 0; }); 
    } 
} 
相關問題