我试图用新的视频 id 更改的 data-video 属性，但它没有改变
Posted
技术标签:
【中文标题】我试图用新的视频 id 更改的 data-video 属性，但它没有改变【英文标题】：The data-video attribute I am trying to change with new video id but it is not changing 【发布时间】：2018-01-13 05:12:45 【问题描述】：我试图将视频 ID 8IYzyTYucKQ 动态更改为 WKV_z36pVAk，但它没有改变。
我认为下面的库仅适用于页面重新加载，因此当我单击按钮时，新 ID 会更改，但视频会播放旧 ID，当我再次重新加载视频时，ID 会重置为默认值。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>About</title>
<script type="text/javascript">
function val1(val)
location.reload();
document.getElementsByTagName("div")[0].setAttribute("data-video", val);
//document.getElementById("youtube-audio").data-video=val;
//document.getElementById("p1").innerHTML=val;
alert(val);
</script>
</head>
<body>
<h3 style="color:#0066dd">Hello</h3>
<center>
<div data-video="8IYzyTYucKQ"
data-autoplay="0"
data-loop="1"
id="youtube-audio">
</div>
</center>
<button onclick="val1('WKV_z36pVAk')">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>
【问题讨论】：
你在使用 jQuery 库吗？ 是的，还有 youtube 库 你为什么使用 location.reload(); ？ 因为新视频不仅播放了新的id变化而是播放了旧视频 【参考方案1】：在更改数据属性后，您正在重新加载页面：
location.reload();
当页面刷新并再次准备好时，将属性返回到默认值的原因。
使用 API 的简单示例：
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://www.youtube.com/iframe_api"></script>
</head>
<body>
<h3 style="color:#0066dd">Hello</h3>
<button id="change_video">change</button>
<div id="player"></div>
<script>
var player;
function onYouTubeIframeAPIReady()
player = new YT.Player('player',
height: '360',
width: '640',
videoId: 'M7lc1UVf-VE'
);
$('#change_video').on('click', function()
player.loadVideoById('WKV_z36pVAk');
)
</script>
</body>
</html>
希望这会有所帮助。
【讨论】：
您好，我提出了问题，请查看链接：***.com/questions/45571141/…以上是关于我试图用新的视频 id 更改的 data-video 属性，但它没有改变的主要内容，如果未能解决你的问题，请参考以下文章
在 iTunes Connect 上上传应用程序后更改捆绑 ID