Question

我希望能够通过<input type="text">字段设置要通过用户输入播放的视频ID。

我天真的尝试看起来像是

<!DOCTYPE html>                                                                                        
<html>                                                                                                 
  <body>                                                                                               
    <p>                                                                                                
      ID:<input type="text" id="ytvideoid">                                                            
      <button onclick="loadVideo()">Load</button>                                                      
    </p>                                                                                               

    <iframe id="ytplayer" type="text/html" width="640" height="390"</iframe>                           

    <script>                                                                                           
      function loadVideo() {                                                                           
        var ytplayer = document.getElementByID("ytplayer");                                            
        var videoid = document.getElementByID("ytvideoid").value;                                      

        ytplayer.cueVideoById({                                                                        
          videoId: videoid                                                                             
        });                                                                                            
        ytplayer.playVideo();                                                                          
      }                                                                                                
    </script>                                                                                          
  </body>                                                                                              
</html>

但输入ID并点击＆＃34;加载＆＃34;。

后，播放器小部件仍为空白

有什么问题？

Answer 1

使用前定义一个函数。只需将<script>移到<button>
您有typo两次getElementById有一个小写＆＃34; d＆＃34;。

最后看起来像这样：

<!DOCTYPE html>                                                                                        
<html>                                                                                                 
  <body>      

    <script>                                                                                           
      function loadVideo() {                                                                           
        var ytplayer = document.getElementById("ytplayer");                                            
        var videoid = document.getElementById("ytvideoid").value;                                      

        ytplayer.cueVideoById({                                                                        
          videoId: videoid                                                                             
        });                                                                                            
        ytplayer.playVideo();                                                                          
      }                                                                                                
    </script>                                                                                                      
    <p>                                                                                                
      ID:<input type="text" id="ytvideoid">                                                            
      <button onclick="loadVideo()">Load</button>                                                      
    </p>                                                                                               

    <iframe id="ytplayer" type="text/html" width="640" height="390"</iframe>                           

  </body>                                                                                              
</html>

然而，我无法帮助您，因为在修复这两个问题之后，您的示例并不起作用，因为它不包含使其工作所需的所有代码。

如何设置用户输入的视频ID

1 个答案: