12

以下は、HTML5ビデオプレーヤーイベント用です。

私のパートナーと私は、この問題について1日の大部分で困惑しており、誰かがこの問題について何らかの洞察を提供してくれることを願っています。以下に示すように、プレーンjsを使用して進行状況イベントにアクセスできましたが、jQueryを使用してこれにアクセスしようとすると、コンソールで未定義になります。ヘルプ/推奨事項は大歓迎です。

    //JS - Works like a charm
document.addEventListener("DOMContentLoaded", init, false);
function init() {
    var v = document.getElementById('test-vid');
    console.log(v)
    v.addEventListener('progress', progress, false);
}
function progress(e) {
    console.log(e.lengthComputable + ' ' + e.total + ' ' + e.loaded);
}


    //  jQuery - NO BUENO - Undefined rendered in console
    var vid = $('#test-vid');
    $(vid).bind("progress", function(e){
            console.log(e.total + ' ' + e.loaded + ' ' + e.lengthComputable );

            });

前もって感謝します、

JN

4

4 に答える 4

5

使用しない理由：

    $('video#test-vid').bind("progress",function(e){
        console.log(e.total + ' ' + e.loaded + ' ' + e.lengthComputable );
    });

これは機能するはずです、jQueryはイベントをバインドする必要があります

こちらをご覧ください

HTML5 <video>コールバック？

于 2010-06-08T04:12:01.317 に答える
2

jQueryはイベントプロパティのホワイトリストを使用してイベントを正規化するため、未定義になります。このリストには、ロードも合計も含まれていません。

情報を取得したい場合は、e.originalEvent.lengthComputableなどを使用する必要があります。

しかし、正直なところ、これを行うべきではありません。このイベントプロパティはFirefoxのみであり、html5仕様の一部ではなくなりました。他のブラウザではバッファリングされたオブジェクトを使用する必要があります。進捗状況は、html5メディア要素では本当に問題があります。iPadのサファリはMacのサファリなどとは動作が異なります。

進行状況イベントのクロスブラウザー実装は、jMediaelement-libaryにあります： http ：//github.com/aFarkas/jMediaelement/blob/1.1.3/src/mm.base-api.js#L312

アレックスに関して

于 2010-06-22T21:11:39.840 に答える
1

originalEventを使用します。

if(e.originalEvent.lengthComputable && e.originalEvent.total){
     var loaded = e.originalEvent.loaded / e.originalEvent.total * 100;
}
于 2010-08-25T16:32:48.427 に答える
0

いくつかの野生の推測...

あなたが持っている：

var vid = $('#test-vid');
$(vid).bind(...

その2行目では、vidはすでにjQueryオブジェクトです。単純に使ってみましたvid.bind()か？

あるいは、addEventListener作品を知っているなら、それを使ってみませんか？jQueryで選択した後、装飾されていないDOMオブジェクトを出力すると、運が良かったかもしれません。

var vid = $('#test-vid');
vid.get().addEventListener(...
于 2010-06-08T04:25:50.737 に答える