video per function mit variablem source

Zerberus777

Mitglied
Hallo,

ich versuche mit

Code:
<html lang="de">
...
<p style="cursor:pointer;" onclick="videoplay('video1.mp4')">Starte Video</p>
...
<script>
var datei;
function videoplay(datei) {
alert(datei);
document.getElementById('player').innerHTML="<video width='700' controls><source src=datei type='video/mp4'></video>"
};
</script>
...
</html>

ein Video einzubinden. alert sagt mir auch, daß die Variable datei den Inhalt "video1.mp4" hat. Allerdings kommt der Fehler "Alle Kandidaten für die Ressource konnten nicht geladen werden. Medien-Laden pausiert."

Was ist mein Fehler?

Schönen Abend noch

Zerberus
 
Ach so, das habe ich vorhin nicht gesehen. Du musst die Variable in den String einketten:
Code:
document.getElementById('player').innerHTML="<video width='700' controls><source src=\"" + datei + "\" type='video/mp4'></video>"
 
Vielen Dank, jetzt klappt es!

Für mein Verständnis: was bewirken die beiden Zeichenfolgen vor und hinter datei? Wird es dadurch zu "datei"?
 
Um die Variable einzufügen, muss man den String unterbrechen. Bei deiner ursprüngliche Version wird die Zeichenfolge "datei" einfach so in den String eingesetzt, ohne dass sie durch ihren Inhalt ersetzt wird. Das Ergebnis wäre:
Code:
<video width='700' controls><source src=datei type='video/mp4'></video>
Und um Strings (linker String, Inhalt der Variable = String, rechter String) zu verketten, ist in Javascript das Plus-Zeichen vorgesehen. Und das \" bewirkt, dass ein " in den String eingefügt wird. Das \ ist erforderlich, damit JS es nicht als String-Anfangs-/Endezeichen interpretiert. Das Ergebnis ist dann:
Code:
<video width='700' controls><source src="video1.mp4" type='video/mp4'></video>
 
Zurück