按下按钮时动态加载 iframe

Question

我正在创建一个网页，我必须在 div 中加载 iframe。

<div class="sketchfab">
    <iframe class="myframe" src=""></iframe>
</div>

在它下面我有链接应该提供 iframe 的来源。

<div class="container">
    <a href=#>A</a>
    <a href=#>B</a>
    <a href=#>C</a>
    <a href=#>D</a>
    And so on till Z
</div>

我该怎么做？
iframe 显示标志手势的 3D 动画。所以基本上当我按下A的超链接时，A的手势就会出现......等等......

Answer 1

HTML

<div class="">
    <a href="#" data-url="hMxGhHNOkCU">A</a>
    <a href="#" data-url="BWXggB-T1jQ">B</a>
    <a href="#" data-url="gqOEoUR5RHg">C</a>
    <a href="#" data-url="5GcQtLDGXy8">D</a>
    And so on till Z
</div>

还有 Javascript：

$(function() {
    $('a').click(function() {
    var _this = $(this),
            iframe = $('iframe');

    iframe.attr('src','https://www.youtube.com/embed/' + _this.attr('data-url'));
  });
});

您可以查看this Fiddle。