Javascript - onclick，播放聲音，等待x秒，加載URL

目前，我有一個圖像鏈接到一個頁面，並通過onClick事件來點擊播放聲音。Javascript - onclick，播放聲音，等待x秒，加載URL

<div style="display:none;"> 
    <audio id="audio1" src="SOUND.wav" controls preload="auto" autobuffer></audio> 
</div> 

<script> function EvalSound(soundobj) 
    { var thissound=document.getElementById(soundobj); thissound.play(); } 
</script> 

<a href="PAGE.php" onClick="EvalSound('audio1')"><img src="IMAGE.png"></a>

這工作正常，但聲音被頁面加載切斷。假設「SOUND.wav」長10秒，我如何編輯我的代碼，以便點擊圖像時聲音播放時暫停10秒，然後加載頁面？

謝謝你或你的幫助。

來源

2012-12-19 Robert Mastriano

你可以改變你的代碼如下：

<div style="display:none;"> 
    <audio id="audio1" src="SOUND.wav" controls preload="auto" autobuffer></audio> 
</div> 

<script> function EvalSound(soundobj) 
    { var thissound=document.getElementById(soundobj); thissound.play(); 
setTimeout(function() { window.location.href = 'PAGE.php'; }, 1000); } // change 1000 to whatever value you would want to wait in milliseconds. 
</script> 

<a href="#" onClick="EvalSound('audio1')"><img src="IMAGE.png"></a

來源

2012-12-19 20:52:58 malkassem

謝謝你，偉大的工作，但有什麼辦法可以追加超時/ window.location.href到？可能有多個圖像鏈接到具有相同音頻剪輯的不同頁面。 –

當然。您可以將您的標籤更改爲和從函數中刪除setTimeout。 – malkassem

優秀。非常感謝你。 :) –

同我以前的答案，只是建議你使用的音頻API來確定聲音的持續時間，並將其設置爲超時。

此外，要更改網址，您可以將其添加爲參數。

function EvalSoundAndRedirect(soundobj, url) { 
    var thissound = document.getElementById(soundobj); 
    thissound.play(); 
    setTimeout(function() { 
     window.location.href = url; 
    }, thissound.duration); 
}

使用：

<a href="#" onClick="EvalSoundAndRedirect('audio1', 'PAGE.php')"><img src="IMAGE.png" /></a>

來源

2012-12-19 21:04:07 iMoses

這將工作得很好，除了音頻文件有一點白噪聲在我想要中斷的末尾。設置自己幫助的時間。 –

Javascript - onclick，播放聲音，等待x秒，加載URL

回答

相關問題