javascript - 点击时 Fancybox 加载 div？

Question

标题说明了一切。我想加载链接内的所有内容，而不是在页面加载时单击。我注意到它与页面一起加载的方式是我的 adblock 正在检测广告并且我在空白页面中测试它。我打算在同一个页面上使用许多这样的链接，如果这样做的话，加载时间会很长。

问题:有没有办法在点击时加载链接内的 div，而不是沿着页面加载？

例子:

http://jsfiddle.net/qpL14ysg/

代码:

<a href="#divForm" id="btnForm">Load Form</a>

<div id="divForm" style="display:none">
  <iframe style='overflow: hidden; border: 0; width: 600px; height: 480px' src='http://embed.novamov.com/embed.php?v=19bf3a4b7fe49' scrolling='no'></iframe>
</div>

<script type="text/javascript">
$(function() {
    $("#btnForm").fancybox({
        'onStart': function() { $("#divForm").css("display","block"); },            
        'onClosed': function() { $("#divForm").css("display","none"); }
    });
});
</script>

Answer 1

这不是加载 iframe 的正常 fancybox 方式。看看 documentation你可以告诉 fancybox 在点击时创建 iframe。

<a class="fancybox fancybox.iframe" href='video url here' id="btnForm">Load Form</a>

$(function () {
    $("#btnForm").fancybox({
        width: 600,
        height: 480
    });
});

http://jsfiddle.net/qpL14ysg/1/