クリック時に手動でビデオをスキップ/スキップする

Question

ユーザーがビデオをスキップできるようにskip buttonをクリックすると、ビデオをendに送信しようとしています。

私は以下のものを使用しています。これはすべて役に立ちました。ビデオの終了時にアクションをトリガーすることができます。

HTML

<video autoplay> 
    <source src="video.mp4" type="video/mp4"> 
</video> 
<button class="skip">Skip video</button> 

JSは

$('video').on('ended',function(){.... 
    //do stuff here 
} 

は、しかし、私は次のような何かをしたいのですが、これを実装する方法がわかりません。

$('.skip').click(function(){ 
    $('video').end(); 
}); 

Answer 1

戻る前セレクタに取得するために使用してjQueryのにend()方法。 jQueryのドキュメントから

説明：

現在のチェーン内の最新のフィルタリング処理を終了し、その前の状態にマッチした要素のセットを返します。ビデオを停止するには

---

はHTMLMediaElement#pauseメソッドを使用し、その後、DOMオブジェクトを取得して。最終的には、trigger()メソッドを使用してプログラムでendedイベントをトリガーしますが。

$('.skip').click(function(){ 
    $('video').trigger('ended')[0].pause(); 
}); 

Answer 2

ビデオの再生終了までの移動は、ビデオの長さを取得してからそのポイントに移動する必要があるため、簡単な操作ではありません。

もっと簡単な方法は、endedの下に呼び出されたロジックを抽出し、ボタンをクリックしたときに呼び出すことです。これを試してください：あなたはjsfiddle.netで表示することができ

$('video').on('ended', function() { 
    videoEnded(); 
}) 

$('.skip').click(function() { 
    $('video')[0].pause(); 
    videoEnded(); 
}); 

function videoEnded() { 
    // do stuff here 
} 

Working example

Answer 3

$('.skip').click(function(){ 
    $('video')[0].load(); 
    $('video')[0].pause(); 
});