如何创建使用jquery

Question

我希望当有人点击它时，在我的网页上插入一个iframe。我该如何做到这一点？当有人只是查看页面时，iframe将变为不可见，但是当单击按钮时，iframe将变为可见。我怎么能这样做？

Answer 1

为您的iframe添加类似hidden iframe的类，然后在结束</body>标记之前添加以下JavaScript：

你的框架

<iframe src="..." other-iframe-stuff="" class="hidden iframe">

</iframe> 

JS

<script>
$(function(){
   $(".your-toggle-btn").click(function(){
      $(".iframe").removeClass("hidden");
   });
});
</script>

您的按钮应该有your-toggle-btn类，并定义以下CSS样式：

CSS

.hidden {
    display: none;
}

Answer 2

提供iframe和按钮类或数据属性，以便您可以引用它们。

然后使用jQuerys hide（）和show（）函数创建一个在按钮单击时显示iframe的事件。非常重要的是，如果您想在javascript关闭时让网站正常运行，那么iframe就是可见的。

<script>
$(function(){
   var $button = $('.iframe-opener'); // or [data-iframe-opener]
   var $iframe = $('.iframe'); // or [data-iframe]
   $iframe.hide();
   $button.click(function() {
       $iframe.show();
   });
});
</script>