admin管理员组文章数量:1130349
Aphorism
Grow In Errors!
前言
最近 肾七 电池不耐用了， 想想 左腹就隐隐作痛， 咳咳 ，回归正题， 我就联系了下 apple 客服，准备换个 电池，2018年 12.31 前 更换苹果电池是有优惠政策的。 在打开 聊天室的时候， 突然 发现 浏览器重新打开了 窗口； 又回想到了 之前公司的 登陆 表单也是 在一个小窗口中打开输入登陆信息的。 嗯， 强迫症来了
主要api
- window.open 打开动作
- window.opener 由谁打开的
打开新的 tab 和 打开新的 浏览器窗口
origin page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>origin Page</title>
</head>
<body>
i am origin page!
<br>
<p>
<a href="javascript:;" onclick="jumpPage();">window.open 打开新标签页</a>
</p>
<p>
<a href="http://www.w3school" target="_blank">html方式 打开新标签页</a>
</p>
<p>
<a href="javascript:;" onclick="openRequestedPopup();">window.open 打开新的浏览器窗口</a>
</p>
<br>
<script>
window.name = "origin";
function open_win() {
window.open("http://www.w3school")
}
function jumpPage() {
window.open("http://www.w3school", 'hello');
}
var windowObjectReference;
var strWindowFeatures = "width=1000,height=500,menubar=yes,location=yes,resizable=yes,scrollbars=true,status=true";
function openRequestedPopup() {
// windowObjectReference = window.open("http://www.w3school", "CNN_WindowName", strWindowFeatures);
windowObjectReference = window.open("./b.html", "B_page", strWindowFeatures);
setTimeout(function () {
//windowObjectReference.close(); // 我们页面中关闭 或进行其他操作 打开的 窗口页
console.log(windowObjectReference.position); // 10s 后 在origin winodw 控制台 打印 B_page 视口对象中的position 成员
}, 10000);
}
</script>
</body>
</html>
b page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>b page</title>
</head>
<body>
i am b page!
<script>
console.log(window.name);
var position = "b page";
console.log(window.opener.name); // 通过这个方法获取 源窗口对象 // 注意跨域页面是不能获取到的
</script>
</body>
</html>
打开新的 tab 标签页 就不多做解释了
我们通过 window.open 方法 的第三个参数 strWindowFeatures 配置后， 就可以在新的窗口中打开， 该方法会返回 打开的窗口对象。 在新的窗口中，我们也可以通过 window.opener 来获取到 源窗口 对象。
Aphorism
Grow In Errors!
前言
最近 肾七 电池不耐用了， 想想 左腹就隐隐作痛， 咳咳 ，回归正题， 我就联系了下 apple 客服，准备换个 电池，2018年 12.31 前 更换苹果电池是有优惠政策的。 在打开 聊天室的时候， 突然 发现 浏览器重新打开了 窗口； 又回想到了 之前公司的 登陆 表单也是 在一个小窗口中打开输入登陆信息的。 嗯， 强迫症来了
主要api
- window.open 打开动作
- window.opener 由谁打开的
打开新的 tab 和 打开新的 浏览器窗口
origin page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>origin Page</title>
</head>
<body>
i am origin page!
<br>
<p>
<a href="javascript:;" onclick="jumpPage();">window.open 打开新标签页</a>
</p>
<p>
<a href="http://www.w3school" target="_blank">html方式 打开新标签页</a>
</p>
<p>
<a href="javascript:;" onclick="openRequestedPopup();">window.open 打开新的浏览器窗口</a>
</p>
<br>
<script>
window.name = "origin";
function open_win() {
window.open("http://www.w3school")
}
function jumpPage() {
window.open("http://www.w3school", 'hello');
}
var windowObjectReference;
var strWindowFeatures = "width=1000,height=500,menubar=yes,location=yes,resizable=yes,scrollbars=true,status=true";
function openRequestedPopup() {
// windowObjectReference = window.open("http://www.w3school", "CNN_WindowName", strWindowFeatures);
windowObjectReference = window.open("./b.html", "B_page", strWindowFeatures);
setTimeout(function () {
//windowObjectReference.close(); // 我们页面中关闭 或进行其他操作 打开的 窗口页
console.log(windowObjectReference.position); // 10s 后 在origin winodw 控制台 打印 B_page 视口对象中的position 成员
}, 10000);
}
</script>
</body>
</html>
b page
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>b page</title>
</head>
<body>
i am b page!
<script>
console.log(window.name);
var position = "b page";
console.log(window.opener.name); // 通过这个方法获取 源窗口对象 // 注意跨域页面是不能获取到的
</script>
</body>
</html>
打开新的 tab 标签页 就不多做解释了
我们通过 window.open 方法 的第三个参数 strWindowFeatures 配置后， 就可以在新的窗口中打开， 该方法会返回 打开的窗口对象。 在新的窗口中，我们也可以通过 window.opener 来获取到 源窗口 对象。
版权声明：本文标题：如何通过 js 打开一个新的浏览器窗口 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://it.en369.cn/jiaocheng/1726854684a674261.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。
发表评论