动态更改youtube上的视频ID [英] Dynamically change the video id on youtube

查看:741
本文介绍了动态更改youtube上的视频ID的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试使用以下代码显示没有视频的youtube音频,因此我正在更改视频ID,但它一次又一次地播放相同的ID。

I am trying to display youtube audio without video with the below code so I am changing the video id but it is playing the same id again and again.

<!DOCTYPE html> 
    <html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>About</title>
         <script type="text/javascript">
          function val1(val)
          {

        document.getElementsByTagName("div")[0].setAttribute("data-video", val);
                            alert(val);


          }

         </script>
    </head> 
    <body onload="val1('WKV_z36pVAk')"> 
    <h3 style="color:#0066dd">Hello</h3>

    <center>


    <div data-video="8IYzyTYucKQ"
         data-autoplay="0"
         data-loop="1"
         id="youtube-audio">
    </div> 

    </center>
    <button>change</button>


    </body> 
    <script src="https://www.youtube.com/iframe_api"></script>
   <script src="https://cdn.rawgit.com/labnol/files/master/yt.js"></script>
    </html>


推荐答案

不太确定你要创建什么,但是这可能会让你走向正确的方向。

Not quite sure what you are trying to create, but this might head you into the right direction.

您可以使用此代码以某种hacky方式重新加载特定元素

You can reload the specific element in a kind of hacky way using this code

function reload(vidId){ <-- Added a parameter
    var container = document.getElementById("youtube-audio");
    container.setAttribute("data-video", vidId); <-- Added line to change data-video
    var content = container.innerHTML;
    container.innerHTML= content;
}

然后将其添加到您的HTML

And then add this to your HTML

<button onclick="reload('8IYzyTYucKQ')">Reload</button> <-- Added the parameter to what the `data-video` should be changed

这篇关于动态更改youtube上的视频ID的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆