Проблемы с загрузкой YouTube плеера после нажатия кнопки. Подходит ли это для бэкенда? - PullRequest
0 голосов
/ 02 мая 2019

* Я супер новичок в этом, так что не стесняйтесь смеяться над моей борьбой *

М цель состоит в том, чтобы заставить игрока YouTube загружаться после события щелчка, однако когда я нажимаюкнопка ничего не загружает.Я не слишком уверен, как работает API, и, вероятно, это как-то связано с этим.Большая часть кода остается нетронутой и просто импортируется непосредственно из youtube.

Я пробовал javaScript и jQuery способы использования события click, и часть журнала консоли работает, только если я помещаю его в начало функции.

<body> 
  <input type="text" name="searchText" placeholder='LzeBDlJHhrc' id="pls">
  <button id="searchButton">Search</button> 

<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
  <div id="player"></div> 

  <script>

<!-- ok boom here comes the issues -->
    $('button').click(function(){
        console.log('wow');  //this part works..... everything after does not


    // 2. This code loads the IFrame Player API code asynchronously.
    var tag = document.createElement('script');

    tag.src = "https://nam05.safelinks.protection.outlook.com/?url=https%3A%2F%2Fwww.youtube.com%2Fiframe_api&amp;data=02%7C01%7Ctmims%40pc.pitt.edu%7Cc29df9b90f5646f79a6108d6ce43c397%7C9ef9f489e0a04eeb87cc3a526112fd0d%7C1%7C0%7C636923187771451008&amp;sdata=EfaESRwtz98JlHKhauwu%2BB%2B5n7gREdnMYzprXo3y8Y4%3D&amp;reserved=0";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    // 3. This function creates an <iframe> (and YouTube player)
    //    after the API code downloads.
    var player;
    function onYouTubeIframeAPIReady() {
      player = new YT.Player('player', {
        height: '390',
        width: '640',
        videoId: 'LzeBDlJHhrc',
        events: {
          'onReady': onPlayerReady,
          'onStateChange': onPlayerStateChange
        }
      });
    }

    // 4. The API will call this function when the video player is ready.
    function onPlayerReady(event) {
      event.target.playVideo();
    }

    // 5. The API calls this function when the player's state changes.
    //    The function indicates that when playing a video (state=1),
    //    the player should play for six seconds and then stop.
    var done = false;
    function onPlayerStateChange(event) {
      if (event.data == YT.PlayerState.PLAYING && !done) {
        setTimeout(stopVideo, 6000);
        done = true;
      }
    }
    function stopVideo() {
      player.stopVideo();
    }
   });
  </script>
</body>

Я ожидал, что он будет загружаться при щелчке, но он будет пустым и ничего не попадет в консоль.

...