Odtwarzasz powiadomienia dźwiękowe za pomocą JavaScript?

Jak mogę to zrobić, więc kiedy użytkownik kliknie link, odtwarzamy dźwięk? Używając javascript i jquery tutaj.

Użyj tej wtyczki: https://github.com/admsev/jquery-play-sound

$.playSound('http://example.org/sound.mp3');

Umieść <audio>element na swojej stronie.
Zdobądź swój element audio i wywołaj play()metodę:

document.getElementById('yourAudioTag').play();

Sprawdź ten przykład: http://www.storiesinflight.com/html5/audio.html

Ta strona odkrywa kilka innych fajnych rzeczy można zrobić, takie jak load(), pause()oraz kilku innych właściwości elementu audio.

To, kiedy dokładnie chcesz odtworzyć ten element audio, zależy od Ciebie. Przeczytaj tekst przycisku i porównaj go z „nie”, jeśli chcesz.

Alternatywnie

http://www.schillmania.com/projects/soundmanager2/

SoundManager 2 zapewnia łatwy w użyciu interfejs API, który umożliwia odtwarzanie dźwięku w dowolnej nowoczesnej przeglądarce, w tym IE 6+. Jeśli przeglądarka nie obsługuje HTML5, wówczas pomaga jej flash. Jeśli chcesz ściśle HTML5 i bez Flasha, jest do tego ustawienie preferFlash = false

Obsługuje dźwięk w 100% wolny od Flasha na iPadzie, iPhonie (iOS4) i innych urządzeniach obsługujących HTML5 + przeglądarkach

Używanie jest tak proste, jak:

<script src="soundmanager2.js"></script>
<script>
// where to find flash SWFs, if needed...
soundManager.url = '/path/to/swf-files/';

soundManager.onready(function() {
    soundManager.createSound({
        id: 'mySound',
        url: '/path/to/an.mp3'
    });

    // ...and play it
    soundManager.play('mySound');
});

Oto demo w akcji: http://www.schillmania.com/projects/soundmanager2/demo/christmas-lights/

Znalazłem coś takiego:

//javascript:
function playSound( url ){   
  document.getElementById("sound").innerHTML="<embed src='"+url+"' hidden=true autostart=true loop=false>";
} 

Za pomocą tagu audio html5 i jquery:

// appending HTML5 Audio Tag in HTML Body
$('<audio id="chatAudio">
    <source src="notify.ogg" type="audio/ogg">
    <source src="notify.mp3" type="audio/mpeg">
</audio>').appendTo('body');

// play sound
$('#chatAudio')[0].play();

Kod stąd .

W mojej implementacji dodałem audio embed bezpośrednio do HTML bez dołączania jquery.

Menedżer dźwięku JavaScript:

http://www.schillmania.com/projects/soundmanager2/

$('a').click(function(){
    $('embed').remove();
    $('body').append('<embed src="/path/to/your/sound.wav" autostart="true" hidden="true" loop="false">');
});

Napisałem małą funkcję, która może to zrobić, z interfejsem API Web Audio ...

var beep = function(duration, type, finishedCallback) {

    if (!(window.audioContext || window.webkitAudioContext)) {
        throw Error("Your browser does not support Audio Context.");
    }

    duration = +duration;

    // Only 0-4 are valid types.
    type = (type % 5) || 0;

    if (typeof finishedCallback != "function") {
        finishedCallback = function() {};   
    }

    var ctx = new (window.audioContext || window.webkitAudioContext);
    var osc = ctx.createOscillator();

    osc.type = type;

    osc.connect(ctx.destination);
    osc.noteOn(0);

    setTimeout(function() {
        osc.noteOff(0);
        finishedCallback();
    }, duration);

};

Nowy plik wyskakujący ... wydaje się być do tej pory zgodny z przeglądarkami IE, Gecko i iPhonem ...

http://www.jplayer.org/

Poniższy kod może pomóc w odtwarzaniu dźwięku na stronie internetowej przy użyciu wyłącznie javascript. Więcej szczegółów można znaleźć pod adresem http://sourcecodemania.com/playing-sound-javascript-flash-player/

<script>
function getPlayer(pid) {
    var obj = document.getElementById(pid);
    if (obj.doPlay) return obj;
    for(i=0; i<obj.childNodes.length; i++) {
        var child = obj.childNodes[i];
        if (child.tagName == "EMBED") return child;
    }
}
function doPlay(fname) {
    var player=getPlayer("audio1");
    player.play(fname);
}
function doStop() {
    var player=getPlayer("audio1");
    player.doStop();
}
</script>

<form>
<input type="button" value="Play Sound" onClick="doPlay('texi.wav')">
<a href="#" onClick="doPlay('texi.wav')">[Play]</a>
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
    width="40"
    height="40"
    id="audio1"
    align="middle">
    <embed src="wavplayer.swf?h=20&w=20"
        bgcolor="#ffffff"
        width="40"
        height="40"
        allowScriptAccess="always"
        type="application/x-shockwave-flash"
        pluginspage="http://www.macromedia.com/go/getflashplayer"
    />
</object>

<input type="button" value="Stop Sound" onClick="doStop()">
</form>

Po pierwsze, nie spodobało mi się to jako użytkownikowi.

Najlepszym sposobem na to jest prawdopodobnie użycie małego apletu flash, który odtwarza dźwięk w tle.

Odpowiedziałem również tutaj: Cross-platform, cross-browser sposób na odtwarzanie dźwięku z Javascript?