iframe子窗口调用父窗口的方法与window.open打开新页面调用前窗口的方法

最近辞职的三个月,目前正在找工作中。今天面试了这样一道题,之前是没遇到过的,在此记录一下

	// 父页面
	<div></div>
    <button onclick="window.open('b.html')">窗口</button>
    <iframe src="b.html" width="100px" height="100px"></iframe>
    <script>
        function Show(){
            console.log('调用的方法')
        }
    </script>
// 子页面
	<button onclick="Action()">执行</button>
    <script>
        function Action() {
            if (window !== window.parent) { // 判断iframe
            	 window.parent.Show() 
           	} else if(window.opener && window.opener !== window) { //判断是否是window.open打开的页面
           		window.opener.Show() 
           	}
        }
    </script>

需要再服务器上查看,本地直接打开不了。
之后遇到的面试题,看看情况会不会更新吧。

jQuery是一个流行的JavaScript库,它简化了DOM操作和事件处理。如果你想通过jQuery实现点击按钮打开新页面并记录这个窗口,同时允许用户通过另一个按钮关闭这个窗口,你可以这样做: 首先,创建HTML结构,包含两个按钮,一个用于打开窗口,另一个用于关闭: ```html <button id="openBtn">打开新页</button> <button id="closeBtn">关闭窗口</button> <!-- 新窗口元素隐藏,用于后续操作 --> <div id="newWindow" style="display:none;"> <iframe src="" id="targetFrame"></iframe> </div> ``` 然后,在JavaScript文件中,使用jQuery来绑定事件: ```javascript $(document).ready(function() { // 打开新页面的事件 $('#openBtn').click(function() { var win = window.open('', '_blank'); // 使用_blank选项使新窗口独立 // 将新窗口的引用存储起来 $('#newWindow #targetFrame').attr('src', win.location.href); $('#newWindow').show(); // 显示新窗口元素 }); // 关闭窗口的事件 $('#closeBtn').click(function() { if (typeof(window.frames['targetFrame']) !== 'undefined') { // 检查目标窗口是否存在 window.frames['targetFrame'].focus(); // 集中焦点到目标窗口 window.frames['targetFrame'].close(); // 关闭窗口 } $('#newWindow').hide(); // 隐藏新窗口元素 }); }); ``` 在这个例中,当用户点击“打开新页”按钮时,会创建一个新的浏览器窗口,并将新窗口的URL设置为`#newWindow`里的`iframe`的`src`属性。关闭窗口时,我们检查是否有对应的`iframe`存在,并调用其`close()`方法
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值