YouTube视频ID从输入api获取

Question

我正在试用YouTube API，我一直在通过在文本输入中输入URL来获取视频ID。

这是代码；

var player;
var $input = $('#input-field');
var $messageForm = $('#input-form');
$messageForm.submit(function(e){
    e.preventDefault();
    console.log ($input.val());
    $input.val('');
});
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '390',
      width: '640',
      videoId: $input.val(), // The video must be loaded based on $input.val()
      events: {
        onReady: onPlayerReady,
        'onStateChange': onPlayerStateChange,
        onError: onPlayerError
      },
                playerVars: {
                    enablejsapi: 1,
                    controls: 0,
                    disablekb: 1,
                    fs: 0,
                    iv_load_policy: 3,
                    modestbranding: 1,
                    rel: 0,
                    showinfo: 0
                }
    });
  }

我是新手，正在学习javascript，所以对我来说很容易。。

Answer 1

您的代码没有语法错误，但不会产生所需的结果。函数onYouTubeIframeAPIReady只在加载YouTube的API库时执行，我猜那时input-field中没有任何内容。但没有让玩家动态观看和加载视频的规定，所以你必须自己制作一个。例如，您可以利用提交按钮并使用YT的loadVideoById方法，如下所示：

$messageForm.submit(function(e){
    e.preventDefault();
    if (typeof player !== "undefined") {
       player.loadVideoById($(input.val()));
    }
});