fancybox 内容也在页面加载时加载。我希望只有在单击链接时才能加载内容...现在，当您打开页面时，fancybox 内的内容正在加载。我认为你必须放置一个事件处理程序，但我不知道如何。
请观看视频以充分理解! http://www.youtube.com/watch?v=b6MxkBhRC-w
这是我的代码
<body>
<a href="#image_link" title="PutLockerMedia" id="click">watch</a>
<div style="display:none">
<div id="image_link">
<div class="imageWrapper">
<div class="image">
<iframe src="http://www.putlocker.com/embed/E25FA20CE8643E5F" width="600" height="360" frameborder="0" scrolling="no"></iframe>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function() {
$("#click").fancybox();
});
</script>
</body>
最佳答案
您遇到的问题是您正在加载 iframe作为内联内容，因此无论它是否可见，它仍然在后台加载。
您要做的是，不要定位内联选择器 #image_link ，直接定位到 iframe 的内容(其 src 属性的值)在您的 <a> 中标签如:
<a href="http://www.putlocker.com/embed/E25FA20CE8643E5F" title="PutLockerMedia" id="click">watch</a>
...这是您唯一需要的 html(您可以删除隐藏的 div )
然后使用此代码:
$(document).ready(function () {
$("#click").fancybox({
type: "iframe",
width: 600,
height: 360
});
});
参见 JSFIDDLE
关于javascript - 单击链接后如何加载 fancybox 内容？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21691179/