Ich habe den folgenden einfachen Code, der das mediaelement Audio-Plugin initiiert:

$('audio,video').mediaelementplayer({
    audioWidth: 300,
    audioHeight: 30
});

Ich muss das playing Ereignis verfolgen. Ich habe den folgenden Code ohne Glück ausprobiert:

var player = document.getElementsById('player2');
player.playing = function(e) {
   alert('OMG! You played a song!');
}
3
InvalidSyntax 7 Okt. 2012 im 03:36

3 Antworten

Beste Antwort

Ok, also habe ich es herausgefunden ...

$('audio,video').mediaelementplayer({
    audioWidth: 300,
    audioHeight: 30,

    success: function(mediaElement, domObject) {
        mediaElement.addEventListener('loadeddata', function() {
            console.log('addEventListener - loadeddata')            
        }, false);
    },
    error: function() {
        //alert('Error setting media!');
    }

});
5
InvalidSyntax 8 Okt. 2012 im 01:57

Versuche dies:

# using jquery (on, bind, etc)...
$('#player1').bind('playing', function(e) { 
   console.log('bind - playing') 
});

# addEventListener 
var player = document.getElementById('player1'); 
player.addEventListener('playing', function(e) {
   console.log('addEventListener - playing') ;
});
5
krg 7 Okt. 2012 im 00:01

Ein bisschen spät, musste das aber selbst lösen. Ich habe festgestellt, dass in den MediaElement-Dokumenten angegeben ist, dass das erste Argument der Erfolgsfunktion ein mediaElement-Objekt ist. Es kommt einfach so vor, dass der Player-HTML-Code in ein Element eingeschlossen wird, unabhängig davon, um welche Art von Video es sich handelt. Sie können nicht direkt als jQuery-Objekt darauf zugreifen, aber eine einfache Optimierung behebt alles.

Das Folgende wird verwendet, um den nächsten Spieler zu holen, unabhängig davon, welches Element Sie übergeben

function getVideo(el) {
    var $el = $(el);

    if ($el.find('mediaelementwrapper').length) {
        return $el.find('mediaelementwrapper')[0];
    } else if ($el.parents('mediaelementwrapper').length) {
        return $el.parents('mediaelementwrapper')[0];
    }

    return $el.is('mediaelementwrapper') ? $el : false;
}

Beachten Sie, dass wir über [0] darauf zugreifen müssen, indem wir den Dokumentknoten anstelle des jQuery-Objekts zurückgeben.

Aber von dort aus können wir es so verwenden.

$video = getVideo('#playerID');

$video.addEventListener('playing', function () {
    debugger;
}, false);

Oder mach es ohne den Helfer

$video = jQuery('#playerID mediaelementwrapper')[0];
0
Daniel Iser 12 Okt. 2018 im 05:25