プレイヤー開発者の基本:アドバンスプレイヤーコード

このトピックでは、ビデオをプログラムで自動再生する方法を学びます。

ステップ

プレーヤーをプログラム的に制御するための標準的なベストプラクティスコードから始めます。

<video id="myPlayerID"
  data-video-id="5785633544001"
  data-account="921483702001"
  data-player="Uj7Yz80yM"
  data-embed="default"
  data-application-id
  class="video-js"
  controls
  width="640"
  height="360"></video>
<script src="//players.brightcove.net/921483702001/Uj7Yz80yM_default/index.min.js"></script>

<script>
  videojs.getPlayer('myPlayerID').ready(function() {
    var myPlayer = this;

  });
</script>

videojs.getPlayer()メソッドの無名関数で、変数の代入に従って、プレーヤーをミュートして自動再生できるようにします。
```
myPlayer.muted(true);
```
on()プレーヤーのメソッドを使用して、イベントのイベントハンドラ関数を追加します。loadedmetadata
```
myPlayer.on('loadedmetadata', function(){

});
```
イベントハンドラで、ビデオを再生します。
```
myPlayer.play()
```

完全なコード

<!doctype html>
<html>

<head>
  <meta charset="UTF-8">
  <title>Untitled Document</title>
</head>

<body>

  <video id="myPlayerID"
    data-video-id="5785633544001"
    data-account="921483702001"
    data-player="Uj7Yz80yM"
    data-embed="default"
    data-application-id
    class="video-js"
    controls
    width="640"
    height="360"></video>
  <script src="//players.brightcove.net/921483702001/Uj7Yz80yM_default/index.min.js"></script>

  <script>
    videojs.getPlayer('myPlayerID').ready(function() {
      var myPlayer = this;
      // Play here? Two tasks to do
      myPlayer.muted(true);
      myPlayer.on('loadedmetadata', function(){
        myPlayer.play();
      });
    });
  </script>

</body>

</html>

ページコンテンツ

プレイヤー開発者の基本:アドバンスプレイヤーコード

ステップ

完全なコード