ユーザーがビデオのリスト内の要素の 1 つをクリックしたときに、埋め込まれたビデオのソースを変更したいと考えています。FF では正常に動作しますが、IE と Chrome の両方で何も起こりません。この機能をすべてのブラウザで適切に動作させる方法を誰か教えてもらえますか?
ここに私のJavaScriptがあります:
function updateSource(id)
{
var video = document.getElementById('video');
video.src=document.getElementById(id).getAttribute('data-value');
}
そして、ここに私のHTMLがあります:
<embed id="video" src="https://www.youtube-nocookie.com/v/h5NeJaWR5WA?version=3&hl=en_US&rel=0&showinfo=0"
type="application/x-shockwave-flash" width="480" height="360"
allowscriptaccess="never" allowfullscreen="true"></embed>
<li id="one" class="videoLink" style="margin-top: -1em;" onclick="updateSource(this.id)"
data-value="https://www.youtube-nocookie.com/v/h5NeJaWR5WA?version=3&hl=en_US&rel=0&showinfo=0">
<img class="youtubeThumb" src="http://img.youtube.com/vi/h5NeJaWR5WA/default.jpg" />
<p class="videoTitle">Video Number One!</p>
</li>
<li id="two" class="videoLink" onclick="updateSource(this.id)"
data-value="http://www.youtube-nocookie.com/v/r19okL-IW6Q?version=3&hl=en_US&rel=0&showinfo=0">
<img class="youtubeThumb" src="http://img.youtube.com/vi/r19okL-IW6Q/default.jpg" />
<p class="videoTitle">Video Number Two!</p>
</li>