要素ビデオのイベントに変数を設定する方法

Question

こんにちは、誰か助けてください。

可変の持続時間は常に定義されていないのはなぜ

以下

let duration; 

    let video = document.createElement('video'); 
    video.setAttribute("id", 'test') 
    video.setAttribute("src", "https://vdoelearning.s3-ap-southeast-1.amazonaws.com/Charlie%2BPuth%2B-%2BOne%2BCall%2BAway.mp4"); 
    video.preload = 'metadata' 
    video.ondurationchange = function() { 
     duration = video.duration 
    } 

    console.log(duration) 

のようないくつかのコードを持っていますか？私はGoogleで検索してきましたが、解決策は見つかりませんでした。誰も私のような問題を抱えていましたか？

Answer 1

問題は "ondurationchange（）"が非同期に（リスナーが追加された後の未定義の時間に）呼び出されます。宣言の後にconsole.logを作成して、durationが未定義です...コンソールを置くと期間が効果的

video.ondurationchange = function() { 
    duration = video.duration 
    console.log(duration) 
} 

Answer 2

を変更したときに、リスナーの内側.logのあなたは、あなたがondurationchangeイベントにあなたの機能を追加した後、直接console.log(duration)を呼び出している適切なログが表示されます。だから正常に戻りますundefined、それはイベントが少なくとも1回トリガされたときにのみ満たされます。

console.logをdurationのコールバック関数に直接移動すると、実際に呼び出された時刻が表示されます。また、あなたのビデオは決してこのコードで再生されないので、イベントが発生するのではないかと疑います。