Bagaimana untuk memainkan bunyi secara automatik pada acara masukkan tetikus tanpa mengklik pada dokumen?

Question

Saya mempunyai kod HTML berikut:

<div id="word">word</div>

<id audio="pemain">
    <id sumber="sumber"src"sound.ogg"jenis="audio/ogg"
</audio>

dan kod JavaScript/jQuery berikut:

$('#word').mouseenter(function()
{
    var audio = $("#player")[0];
    audio.load();
    audio.play();
});

Pada penyemak imbas saya, kod ini hanya berfungsi jika saya klik Jika tidak, ia tidak berfungsi dan ralat berikut muncul dalam konsol JavaScript:

Tidak ditangkap (dengan janji) DOMException: Kaedah main tidak dibenarkan Ejen pengguna atau platform dalam konteks semasa, mungkin Kerana pengguna menafikan kebenaran.

dan amaran berikut:

Benarkan automain hanya jika pengguna menerima, Pengguna telah berinteraksi dengan tapak web atau fail media mempunyai kelantangan yang ditetapkan Kembali kepada sifar.

Jika saya menetapkan kelantangan kepada sifar, saya mendapat ralat berikut:

Tidak ditangkap (dalam janji) DOMException: Proses mendapatkan semula media Ejen pengguna menamatkan sumber atas permintaan pengguna.

Saya mencubanya pada kedua-dua Chrome dan Firefox.

Answer 1

<div id="word" style="font-size: 30px; margin-bottom: 200px; ">word</div>
    
<audio id="player" controls preload="auto">
     <source src="audio/beep.mp3" controls></source>
     <source src="audio/beep.ogg" controls></source> 
</audio>
 
<script>
    var player = $("#player")[0];
        $("#word").mouseenter(function() {              
        player.play();
    }); 
</script>