javascript 创建并关闭iframe

最新推荐文章于 2023-06-13 16:13:25 发布
最新推荐文章于 2023-06-13 16:13:25 发布
阅读量2.1k 收藏
点赞数
分类专栏： JavaScript 文章标签： iframe javascript stylesheet function html c
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/diligentcatrich/article/details/6762605
版权
 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html>
<head>

<title>Image Gallery</title>
<link  rev="Stylesheet" rel="Stylesheet" href="8.css" />
<script type="text/javascript" language="javascript">

    var testdiv;
    var adiv, d;
    var iframe;
    function openiframe() {
        var e = openiframe.caller.arguments[0] || window.event, obj = e.srcElement || e.target;
        testdiv = obj.parentNode;

        //testdiv  =event.srcElement.parentNode;

        if (!testdiv.getElementsByTagName("iframe")[0]) {

 


            var iframe = document.createElement("iframe");
            iframe.src = "http://www.baidu.com";                                    /* 新iframe 地址*/
            iframe.setAttribute("frameborder", "0", 0);
            iframe.scrolling = "no";
            iframe.style.height = "0px";
            testdiv.appendChild(iframe);

            opendiv();
        }
        else return false;
    }

    function opendiv() {
        iframe = testdiv.getElementsByTagName("iframe")[0];
        d = parseInt(iframe.style.height);
        if (d < 200) {
            d += 4; iframe.style.height = d + "px";
            setTimeout("opendiv()");
        }
        else d = d;
    }

    function closediv1() {
        var c = closediv1.caller.arguments[0] || window.event, obj = c.srcElement || c.target;
        adiv = obj.parentNode;
        closediv();
    }

    function closediv() {

        iframe = adiv.getElementsByTagName("iframe")[0];
        d = parseInt(iframe.style.height);
        if (d > 0) { d -= 10; iframe.style.height = d + "px"; setTimeout("closediv()"); }
        else adiv.removeChild(iframe);
    }

</script>
</head><body>
<div>

<div>
<a href="#" οnclick="openiframe()">查看</a>
<a href="#" οnclick="closediv1()">关闭</a>
</div>

<div>
<a href="#" οnclick="openiframe()">查看</a>
<a href="#" οnclick="closediv1()">关闭</a>
</div>

<div>
<a href="#" οnclick="openiframe()">查看</a>
<a href="#" οnclick="closediv1()">关闭</a>
</div>

<div>
<a href="#" οnclick="openiframe()">查看</a>
<a href="#" οnclick="closediv1()">关闭</a>
</div>

<div>
<a href="#" οnclick="openiframe()">查看</a>
<a href="#" οnclick="closediv1()">关闭</a>
</div>


</div>
</body>
</html>

 

一剑平江湖
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
javascript 关闭iframe外层的div容器
07-29
NULL 博文链接：https://shenlm203.iteye.com/blog/819641
js关闭自定义Iframe弹窗，关闭Iframe弹窗，关闭Iframe弹窗并刷新
i_yuanpeng的博客
02-25 7448
关闭Iframe弹窗：window.parent.getElementById("放Ifarme的id").style.display = "none";//隐藏Iframe弹窗 关闭Iframe弹窗并刷新：parent.location.reload();
js关闭浏览器当前页（iframe）
热门推荐
barton的博客
05-22 3万+
js关闭浏览器当前页    window.close();但是我的项目是在iframe框架的使用window.close(),只是一闪而过，不能起到关闭当前页面的效果，于是仔细查看了页面的dom结构，恍然大悟，原来window.close()关闭的是当前的页面，于是我改为window.parent.close()完美解决！此问题虽小，但还是困扰了我一会儿，于是写此文，不喜勿喷!!...
iframe窗口 js关闭命令
july_young的博客
09-28 1万+
var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引 parent.layer.close(index); //执行关闭  parent.location.href="/company-list.html";//回到父级页面  ...
js关闭iframe窗口_1.温故而知新，再学一遍JavaScript-JS的诞生和组成
weixin_35836405的博客
12-25 373
JavaScript 在近年开发中的应用地位越来越重要。为了更好的使用好这门技术，有必要重新认真的系统的学习一遍。有兴趣的朋友可以一同研究研究，共同进步。由于水平有限，如发现有误，欢迎IT界各位技术朋友指正！谢谢！1、JavaScript 的诞生JavaScript最早诞生于1995年，我们通常也把JavaScript 简称成：JS。我们都知道，开发一个web系统经常会有一些数据需要验证操作的。例...
layer iframe 设置关闭按钮的方法
12-09
本文将详细讨论如何在Layer中为iframe类型的弹窗设置关闭按钮，并对相关知识点进行深入解析。 Layer 是 layui 框架的一个重要组件，它提供了丰富的弹层功能，如提示、警告、确认、iframe、图片预览等。在上述标题和...
基于js的iframe 可关闭tab标签组件使用方法
01-12
本教程将详细讲解如何使用JavaScript实现一个可关闭的iframe内嵌tab标签组件。这个组件能够帮助用户在同一个页面中方便地切换和管理多个内容区域，而无需刷新整个页面。 首先，`iframe`是HTML5中的一个元素，它允许...
layer弹出的iframe层在执行完毕后关闭当前弹出层的方法
10-18
1. 创建一个Layer弹出层，设置类型为2（iframe）并加载需要的页面。 2. 在iframe页面内，执行异步操作（如AJAX请求）。 3. 在AJAX请求成功后的回调函数中，获取当前iframe在父窗口的索引。 4. 使用`setTimeout()`...
Layer组件多个iframe弹出层打开与关闭及参数传递的方法
10-16
2. **关闭iframe弹出层**： - **关闭特定iframe**：在iframe页面内部，通过`parent.layer.getFrameIndex(window.name)`获取当前iframe的索引，然后调用`parent.layer.close(index)`关闭。 - **关闭所有弹出层**：...
layer.close()关闭进度条和Iframe窗的方法
10-18
当需要关闭Iframe窗口时，需要获取到当前Iframe层的索引，然后调用 `layer.close()` 方法。以下是一个示例： ```javascript self.close = function () { // 关闭自身 var index = parent.layer.getFrameIndex...
解析javascript 浏览器关闭事件
10-27
解析javascript 浏览器关闭事件
iframe窗口添加关闭按钮
weixin_30776863的博客
05-13 2614
注意是：layer弹窗 ll <button class="btn btn-danger" onclick="javascript:closethis()"><i class="icon-remove icon-white"></i> Delete</button> <!-- 按钮的单击事件 --> <...
javascript之在iframe中关闭parent窗口
fycghy0803的专栏
02-26 1937
在iframe中加载的页面中使用window.close();将无法关闭对应的parent窗口,必须使用top.close()才能将iframe对应的parent窗口关闭,另必须使用window.open的方式打开窗口,如果不使用window.open打开窗口,即使用在top.close();之前加上top.opener = null,浏览器也会弹出"是否要关闭窗口" 的提示;
layer如何关闭以及父页面如何访问IFRAME页面的JS方法属性
milo0305
03-25 941
先找到IFRAME然后test是子页面的方法 $.find('iframe')[0].contentWindow.test(); layer.closeAll(); //疯狂模式，关闭所有层layer.closeAll('dialog'); //关闭信息框layer.closeAll('page'); //关闭所有页面层layer.closeAll('iframe'); //关闭所有的if
关闭iframe外的页面
jimmy9495的专栏
12-14 272
[code="java"]一个通用页面被某个页面用iframe包含了。通用页面中的关闭按钮原本通过window.close();来关闭页面的，现在无效了。 网上查了下，把通用页面的关闭js改成 window.parent.close(); 页面调用还是无效，原来页面流过来的时候外面还包了个iframe... 再加个parent有用了 window.parent.parent.clo...
iframe无法关闭窗口
weixin_43396067的博客
11-21 1104
有时候用chrom浏览器无法关闭iframe弹出层，window.close()等失效 建议以下方式： &lt;input type="button" class="normal_btn" value=" 取消 " onclick="closeWin();"/&gt; &lt;script type="text/javascript"&gt; function
iframe src页面点击提交按钮，关闭父页面
FinelyYang的专栏
06-13 763
此时，iframe在接受到消息后调用父组件的success事件，父组件调用handleSuccess方法关闭选项卡。success方法用于接收iframe组件的调用，关闭tab页。
判断 iframe 标签是否加载完页面来关闭加载中动画（JavaScript Vue）
weixin_52137696的博客
06-30 7520
判断 iframe 标签是否加载完页面来关闭加载中动画
父页面js监听iframe内子页面并作出响应
Karber的博客
05-28 4952
本文介绍父页面监听iframe内子页面传出的事件并作出反应的方法 父页面使用原生js 子页面使用angular 要实现的效果： 1.父页面有一个input框和一个div，初始值都为0 2.子页面有两个button，add与reduce 3.点击后分别使父页面input框和div内的值+1与-1 页面效果如下 父页面html代码 <body> <div>I'm Parent</div> <input id="displayInput" type="t
vue 关闭iframe
最新发布
08-27
你可以使用 JavaScript 中的 `contentWindow` 属性访问 iframe 的 Window 对象，并调用其 `close()` 方法来关闭 iframe。 ```javascript closeIframe() { this.$refs.myIframe.contentWindow.close(); } ``` ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值