Mein Ziel ist es, das src des Videos abzuspielen, wenn das Video abgespielt wird.

Ich habe derzeit den folgenden Code:

<!doctype html>
<html>
<head>
</head>
<body>
<video width="320" height="240" controls>
  <source src="video.mp4" type="video/mp4">
  <source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>

<script type='text/javascript'>
var vid = document.getElementsByTagName('video')[0];
vid.addEventListener('play', function() {
  console.log('video source:',this.src);
}, false);
</script>
</body>
</html>

Mein erstes Problem ist also, dass this.src nicht funktioniert. es gibt eine leere Zeichenfolge aus. Ich gehe davon aus, dass dies daran liegt, dass das src nicht Teil des video -Tags ist, sondern sich im untergeordneten Tag source befindet.

Ich habe dann versucht, Folgendes in meine Funktion aufzunehmen:

for (var p in this) {
  console.log(p, this[p]);
}

Ich habe dies getan, um zu sehen, ob ich Eigenschaften finden konnte, die darauf verweisen. Aber ich sehe nichts, das direkt darauf verweist? Ist die einzige Möglichkeit, die Quelle wirklich dazu zu bringen, die untergeordneten source Knoten zu erfassen? Wenn ja ... dann ...

Meine zweite Frage: Wie kann ich feststellen, welches src -Attribut tatsächlich zum Abspielen des Videos verwendet wird? IOW Wenn video.mp4 tatsächlich zum Abspielen des Videos verwendet wurde, möchte ich diesen Wert wissen, aber wenn video.ogg tatsächlich zum Abspielen des Videos verwendet wurde, möchte ich stattdessen diesen Wert kennen.

1
slinkhi 22 Nov. 2013 im 21:19

3 Antworten

Beste Antwort

Sie können dies folgendermaßen versuchen:

var vid = document.getElementsByTagName('video')[0];

vid.addEventListener('play', function() {
    console.log('video source:',this.currentSrc);
}, false);
3
melancia 22 Nov. 2013 im 17:30

Das HTML5-Videoelement enthält bereits Ereignisse, sodass kein Listener hinzugefügt werden muss. So würde ich es machen.

var myVid = document.getElementById('videoId');    
if(myVid != null)//if possibility of no video loaded in DOM
{
    myVid.onplay = function () {
        console.log('video source: ' + myVid.currentSrc);
    };
}
0
Jabare Mitchell 26 Aug. 2016 im 19:29

Medienelemente haben anscheinend eine currentSrc -Eigenschaft für Holen Sie sich die ausgewählte Mediendatei.

1
SpliFF 22 Nov. 2013 im 17:31