javascript Audio Objekt vs. HTML5 Audio-Tag

Question

In einem kürzlich Projekt, wenn ich mit einem Sound geladen

var myAudio = new Audio("myAudio.mp3"); 
myAudio.play(); 

Es spielte in Ordnung, es sei denn ein Dialog eröffnet wurde (dh Alarm, bestätigen). Aber als ich versuchte, statt

<audio id="audio1"> 
    <source src="alarm.mp3" type="audio/mpeg" /> 
</audio> 

und mit

var myAudio1 = document.getElementById("audio1"); 
myAudio1.play() 

es weiter zu spielen, nachdem ein Dialog geöffnet wurde ein Audio-Tag in meinem html hinzufügen. Weiß jemand, warum das so ist? Was sind die Unterschiede zwischen den beiden Arten, Sounds zu spielen?

Answer 1

Nach this wiki entry bei Mozilla <audio> und new Audio()sollte gleich sein, aber es sieht nicht so aus, dass der Fall in der Praxis ist. Jedes Mal, wenn ich brauche ein Audio-Objekt in JavaScript erstellen schaffe ich eigentlich nur ein <audio> Element wie folgt:

var audio = document.createElement('audio'); 

, die tatsächlich ein Audio Element erzeugt, dass Sie genau wie ein <audio> Element verwenden können, die in der Seite erklärt wurde HTML.

Um Ihr Beispiel mit dieser Technik erstellen Sie dies tun würden:

var audio = document.createElement('audio'); 
audio.src = 'alarm.mp3' 
audio.play(); 

Answer 2

JavaScript während eines Alarms stoppt oder Bestätigen Feld.

Sie können nicht gleichzeitig Code ausführen und zeigt ein alert(), confirm() oder prompt(), es für die Benutzereingabe auf diese buchstäblich wartet, das ist eine Kernfunktion von JavaScript.

Ich gehe davon aus, dass es genau dieser Grund ist, warum eine Audiodatei vollständig im JavaScript-Bereich wiedergegeben wird. Vergleichsweise Flash-Videoclips oder HTML5-Audio/Video werden weiterhin abgespielt, selbst wenn eine JavaScript-Warnmeldung/Bestätigung/Eingabeaufforderung geöffnet ist.

Was für eine Methode ist besser, das liegt an Ihnen. Es ist ziemlich archaisch, etwas mit der eingebauten JavaScript-/confirm/-Prompt-Eingabeaufforderung zu tun, es gibt deutlich bessere Aufforderungen, die Sie mit jQuery UI machen können, und so weiter.

Wenn Sie viel dynamischen Inhalt auf der Seite haben oder wenn Sie Hintergrundpufferung Audio suchen, bevor sie ausgelöst werden müssen, dann ist JavaScript wahrscheinlich der bessere Weg, um über Dinge zu gehen.

Wenn Sie buchstäblich nur einen Player auf dem Bildschirm haben dann gibt es keine Entschuldigung, nicht in den HTML-Code einfügen. Obwohl es unwahrscheinlich ist, dass es irgendjemanden in diesen Tagen betrifft, ist es immer noch eine schlechte Praxis, sich stark auf JavaScript zu verlassen, wenn es keinen Grund dafür gibt.

Answer 3

Wenn Sie erstellen, wird - dann werden Sie Probleme auf ios, weil es auch zeigen Sie Breite eingestellt: 0px