Question

我正在尝试将用户点击的图片链接ID的值附加到iframe src以向用户显示视频，然后播放该视频。

我能够从id中捕获值，但我不知道如何将其动态传递给iframe src

$(".play-video").click(function() {
    alert("http://www.youtube.com/embed/" + this.id);

    // append the id code into the iframe src=""
});

<div class="video-item">
   <a href="#" class="play-video" id="B-5c8Z-I_x4"><img src="http://img.youtube.com/vi/B-5c8Z-I_x4/1.jpg"></a>
   <br />10/15/2014                            
</div><!-- ./video-item -->

<div class="video-item">
   <a href="#" class="play-video" id="kLRVk-rt1kg"><img src="http://img.youtube.com/vi/kLRVk-rt1kg/1.jpg"></a>
   <br />10/15/2014                            
</div><!-- ./video-item -->

<iframe width="400" height="225" src="" class="user-picked-video" frameborder="0" allowfullscreen></iframe>

Answer 1

只需使用.attr()设置src

的iframe即可

$('iframe.user-picked-video').attr('src', "http://www.youtube.com/embed/" + this.id)

DEMO

Answer 2

使用普通JavaScript只需：

  var myIframe= document.getElementById('myIframe');

  myIframe.src = "http://www.youtube.com/embed/" + myIframe.id;

将id值附加到iframe src属性

2 个答案: