0

jQuery を使用して Youtube iframe の src 属性を動的に更新しようとしています。ここに私のHTMLがあります:

<iframe width="480" height="360" src="" frameborder="0"   allowfullscreen></iframe>


<ul>        
<li>Reading comprehension. <span>
 http://www.youtube.com/embed/O9AuuYOdCGc?rel=0</span>
</li>
</ul>

そしてJavaScript

    $('.manipulated li').click(function(e) {
    var source = $(this).children('span').html();
    $('iframe').attr('src',source);
});

目標は、li アイテムをクリックした後、iframe のソースが更新され、ユーザーが同じ iframe で別のクリップを再生することです。

アイデア、ここで何が間違っているのか、またはこれをどのように行うことができますか?

4

2 に答える 2

3

JQueryでは、使用する.html();とタグが含まれます。この場合、 <span>http://www.youtube.com/embed/O9AuuYOdCGc?rel=0</span>URLだけでなく、iframeのソースをに設定しています。代わりに以下を使用してください:

$('.manipulated li').click(function(e) {
    var source = $(this).children('span').text();
    $('iframe').attr('src',source);
});
于 2013-02-18T20:00:38.740 に答える
0

JavaScriptなしでそれを行う方法を考え出した

<iframe name="testClip" id="testClip" width="480" height="360" src="http://www.youtube.com/embed/" frameborder="0" allowfullscreen></iframe>

 <ul>
 <li>
 <a href="http://www.youtube.com/embed/O9AuuYOdCGc?rel=0" target="testClip">Reading comprehension.</a>
 </li>
 </ul>

この場合、iframe は自動的に更新されます。

于 2013-02-18T20:09:04.253 に答える