关于window.open在不同浏览器的不同点
菜鸟教程: http://www.runoob.com/jsref/met-win-open.html
一、基本语法:
window.open(URL,name,specs,replace)
其中:
URL 为子窗口路径
name 为子窗口名字
specs 为窗口参数(各参数用逗号分隔)
二、返回值:
返回新创建的window对象。所以可以用返回的window调用方法。
第二个对象参数支持不同浏览器支持程度:
https://segmentfault.com/a/1190000016900915
几种打开新窗口的方式
window.open()
- 创造 a 链接,手动触发
a.click()
- 创造 form 表单,手动触发
form.submit()
(创造 form 表单,添加 button 子元素,手动触发button.click()
情况相同,不做区分)
调用情形分组结果
使用 Chrome(70)、Firefox(63)、Edge、IE(9-11) 作为测试浏览器,对以下列举的打开新窗口的情形做测试。
x 表示被拦截,√ 表示新窗口正确打开
直接打开
即页面加载后直接调用打开新窗口代码
方式 | Chrome | Firefox | Edge | IE |
---|---|---|---|---|
window.open() | x | x | x | x |
a.click() | x | x | x | x |
form.submit() | x | x | x | x |
用户点击行为
按钮点击后直接打开
即在按钮被点击的回调中,直接调用打开新窗口的代码
方式 Chrome Firefox Edge IE window.open() √ √ √ √ a.click() √ √ √ √ form.submit() √ √ √ √ 按钮点击后延时打开
即在按钮被点击的回调中,通过 setTimeout 执行打开新窗口代码
方式 Chrome Firefox Edge IE window.open() √ √ × × a.click() √ √ × × form.submit() √ √ × × 按钮点击后在异步请求回调中打开
即在按钮被点击的回调中,发送请求,并在请求的回调中执行打开新窗口代码
方式 Chrome Firefox Edge IE window.open() x x x x a.click() x x x x form.submit() x x x x
用户键盘行为
我们以 input 元素进行测试(其他元素其他键盘事件也有相同效果),因为最可能使用的情况为 input 中使用回车打开新窗口。
input keydown后直接打开
方式 Chrome Firefox Edge IE window.open() √ x √ x a.click() √ x √ x form.submit() √ x √ x 其中 ie9、ie10虽然会弹出拦截弹窗提示,但是能打开新窗口
按钮点击后延时打开
方式 Chrome Firefox Edge IE window.open() √ x x x a.click() √ x x x form.submit() √ x x x 按钮点击后在异步请求回调中打开
方式 Chrome Firefox Edge IE window.open() x x x x a.click() x x x x form.submit() x x x x
规则总结
- 就参与测试的浏览器,三种打开新窗口的方式对拦截结果没有影响。
- 所有浏览器都不允许非用户操作引起的打开新窗口。
- 所有浏览器都不允许在异步 ajax 请求中打开新窗口。
- Edge 和 IE 不允许在 setTimeout 中打开新窗口,Chrome、Firefox 允许在用户操作事件中的 setTimeout 中打开新窗口。
- Firefox 和 IE 不允许在用户键盘操作事件中打开新窗口
解决方案
- 需要在异步 ajax 请求中打开新窗口的可以使用请求前打开新窗口,请求拿到结果后再修改窗口地址的方式。
- 需要在键盘回车事件中打开新窗口的推荐使用 form 表单包装并添加 button 的方式,回车触发默认的 submit 事件进行新窗口的打开。
function click_fun_new(){
var tempwindow=window.open();//先打开临时窗体,由于是点击事件内触发,不会被拦截
$.ajax({
'url': '${pageContext.request.contextPath}/activity/savePrizes.htm',
'type': 'post',
'dataType': 'json',
'data': data,
success: function (data) {
tempwindow.location = "www.baidu.com";//当回调的时候更改临时窗体的路径
},
error:function(){
tempwindow.close();//回调发现无需打开窗体时可以关闭之前的临时窗体
}
}); ---------------------
作者:Elong_Deo
来源:CSDN
原文:https://blog.csdn.net/qq525099302/article/details/51338879
版权声明:本文为博主原创文章,转载请附上博文链接!
关于window.open在不同浏览器的不同点的更多相关文章
- 异步调用window.open时被浏览器阻止新窗口解决方案
var wyWindow = window.open('_blank');$http.post($rootScope.baseUrl + '/Interface0231A.ashx', { userF ...
- 解决弹出的窗口window.open会被浏览器阻止的问题
问题现象 最近在做项目的时候碰到了使用window.open被浏览器拦截的情况,有时候会一直连接,有时候会偶尔拦截, 尝试了很多方法,走了很多弯路,总结一下结果分享大家 原因分析&深入研究 1 ...
- 解决弹出的窗口window.open会被浏览器阻止的问题(自定义open方法)
由于在使用window.open时,在很多情况下,弹出的窗口会被浏览器阻止,但若是使用a链接target='_blank',则不会,基于这一特点,自己封装了一个open方法: function ope ...
- window.frames在不同浏览器中的用法
document.frames 等同于 window.frames,用来取得当前页面内 window 对象的集合. 不支持Firefox,其他浏览器(chrome.opera.IE.360)均支持. ...
- window.close() 关闭当前浏览器页
function eseFun() { var browserName = navigator.appName; //获取浏览器名称 if(browserName == "Netscape& ...
- window.name应用于浏览器端数据存储
本代码简单地分享利用window.name实现浏览器端数据存储: 1.在同一个页面一个地方设置window.name = "abc",另外一个地方读取window.name,自然能 ...
- window.open方法被浏览器拦截的处理方式
问题现象 当我们在一个 ajax 回调中执行 window.open 方法时,新页面会被浏览器拦截. 原因 在 Chrome 的安全机制里,非用户直接触发的 window.open 方法,是会被拦截的 ...
- 关于event 和 window.event问题及浏览器兼容问题
< html> < script language="javascript"> function test(event) { event = event | ...
- 利用window.open如何绕过浏览器拦截机制
在浏览器的安全机制里,非用户触发的window.open方法是会被拦截的,例如: var btn = $('#btn'); btn.click(function () { // 算做用户触发,所以不会 ...
随机推荐
- Mysql(Navicat for Mysql)怎么添加数据库
1.首先打开Navicat for Mysql: 2.打开后界面如下图所示,双击连接localhost_3306: 3.连接后localhost_3306变成绿色,如下图所示: 4.选中下面任意数据库 ...
- 查看并解除Oracle锁
当某个数据库用户在数据库中插入.更新.删除一个表的数据,或者增加一个表的主键时或者表的索引时, 常常会出现ora-00054:resource busy and acquire with nowait ...
- 【转载】Maven+druid+MyBatis+Spring+Oracle+Dubbo开发环境搭建
原地址:http://blog.csdn.net/wp1603710463/article/details/48247817#t16 Maven+druid+MyBatis+spring+Oracle ...
- HDU 6153 A Secret (KMP)
题意:给定两个串,求其中一个串 s 的每个后缀在另一个串 t 中出现的次数. 析:首先先把两个串进行反转,这样后缀就成了前缀.然后求出 s 的失配函数,然后在 t 上跑一遍,如果发现不匹配了或者是已经 ...
- UVa 10766 Organising the Organisation (生成树计数)
题意:给定一个公司的人数,然后还有一个boss,然后再给定一些人,他们不能成为直属上下级关系,问你有多少种安排方式(树). 析:就是一个生成树计数,由于有些人不能成为上下级关系,也就是说他们之间没有边 ...
- SpringMVC源码解读 - HandlerMapping - SimpleUrlHandlerMapping初始化
摘要: SimpleUrlHandlerMapping只是参与Handler的注册,请求映射时由AbstractUrlHandlerMapping搞定. 初始化时,通过setMappings(Prop ...
- hive(在大数据集合上的类SQL查询和表)学习
1.jdbc:mysql://localhost:3306/hive?createDatabaseIfNotExist=true&characterEncoding=UTF-8&use ...
- 20、Semantic-UI之数据验证
20.1 实现数据验证 在很多前端框架中都提供了数据验证的操作,比如jQuery的验证框架等,但是jQuery的验证框架js文件太多:在使用Semantic-UI框架的时候只需要导入semanti ...
- Linux daemon与service 学习笔记
service 常驻在内存中的进程,且可以提供一些系统或网络功能,就是服务. daemon service的提供需要进程的运行,所以实现service的程序我们称为daemon. eg: 实现 ...
- Oracle定時email通知
small_program_task 這張表的資料是待發送的email通知,再次之前已經有一個job會定時掃描固定時間內未接收到小程式回報狀態將其寫入到該表,send_flag為N,表示為寄過通知.e ...