如何只在當前頁面播放聲音？ Java 腳本

Question

我是 Cargo Collective 的平面設計師建築網站。 我想在用戶單擊鼠標或點擊屏幕時播放聲音。 我使用這段代碼：

<script>
function MouseSound() {
    var fileUrl = "https://files.cargocollective.com/c1242413/sound-1.mp3";
    var audio = new Audio(fileUrl);
    audio.play();
}

window.addEventListener('click', MouseSound , false);
</script>

我使用 function MouseSound() 來做到這一點。 但我有一個問題——即使沒有腳本，聲音也會在點擊下一個網站頁面時繼續播放。 我只想在帶有腳本的頁面上播放聲音。

我猜是因為window的事？ 或者它的腳本只是留在緩存中？ 如何在不同的頁面上播放不同的聲音，或者只在有腳本的頁面上播放它們？ 謝謝你。

Answer 1

只需使用document而不是window 。 document指的是這個網頁或 DOM。 你可以這樣做：

document.addEventListener("mouseleave", stopSound);

這將在您離開頁面時觸發，go 到新選項卡，離開瀏覽器 window，關閉瀏覽器 window。 您可以制作一個stopSound() function 來暫停聲音，如下所示：

function stopSound() {
  audio.pause();
}

您也可以使用audio.muted = true使聲音靜音，但這不會暫停聲音，聲音會在后台播放，但我們聽不到。

現在使用audio.play()恢復聲音。 你可以做：

document.addEventListener("mouseenter", playSound);

function playSound() {
  audio.play();
}

只需使用代碼，看看你需要什么套件。