gpt4 book ai didi

javascript - 如何在单击时调用不同 div 中的 div 中的数据?

转载 作者:行者123 更新时间:2023-12-03 06:27:49 27 4
gpt4 key购买 nike

我正在尝试创建一个在线广播电台。作为该过程的一部分,当在页面的不同部分单击故事的播放按钮时,我需要我的播放器调用轨道/故事数据。

我使用 JSON 将数据调用到每个 div。我的故事数据如下:

<div class="play_button text-hide" 
data-id="{id}"
data-title="{title}"
data-storyurl="{fullUrl}"
data-program="{category}"
data-programurl="{category.fullUrl}"
data-type="audio"
data-src="{soundcloudLink}"
data-item-type="story"
data-pub-date="{addedOn}">
</div>

我如何将该数据调用到我的播放器(点击时是一个单独的 div)?

换句话说,我的页面将有多个带有音频文件的故事,每当单击其中一个时,我希望播放器显示

<div>
<a href="{fullUrl}">{title}</a>
<a href="{category.fullUrl}">{category}</a>
</div>

对于每个被点击的轨道/故事。

WBEZ被用作示例。

最佳答案

默认情况下,您可以隐藏数据,onclick 您可以将其设置为可见。

试试这个,

<html>
<head>
<style>
#panel, .flip {
font-size: 16px;
padding: 10px;
text-align: center;
background-color: #4CAF50;
color: white;
border: solid 1px #a6d8a8;
margin: auto;
}

#panel {
display: none;
}
</style>
</head>
<body>

<p class="flip" onclick="myFunction()">Tere Sang yara</p>

<div id="panel">
<p>Tere Sang yara</p>
<p>Movie : Rushtam</p>
<p>Great Movie</p>
<p>Listening now</p>
</div>

<script>
function myFunction() {
document.getElementById("panel").style.display = "block";
}
</script>

</body>
</html>

希望能有所帮助。 :)

关于javascript - 如何在单击时调用不同 div 中的 div 中的数据?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38566541/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com