javascript - 按下按钮时动态加载 iframe

Question

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

<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 .