window.open使用中遇到的问题

前端开发中经常要用到 window.open 弹出一个新窗口来进行交互,但是在使用过程中却会碰到各种各样的问题,下面是我在平时开发过程中碰到的一些问题。

对于winodw.open的使用可以先看下这个文章  http://www.w3help.org/zh-cn/causes/BX1053

一.浏览器拦截

由于各种弹出广告的滥用,现在各个浏览器对window.open的使用都进行了严格的限制,还有各种的弹出窗口拦截器,稍不留神就会导致window.open方法被拦截。

下面这种脚本自动触发的弹窗行为将会被浏览器拦截掉。

<script type="text/javascript">
//将会被拦截
window.open(url);
</script>


那么我们该如何正确的弹出窗口呢,其实只要把弹出窗口的函数绑定到鼠标的onclick事件上浏览器就会认为这是一个合理的open,不会进行拦截。

<script type="text/javascript">
openNewWindow
=function() {
window.open(url);
}
</script>

<button onclick="openNewWindow()">弹出窗口</button>

 

或者你可以将弹出窗口函数绑定到document.body上,只要用户在页面上进行点击就会弹出窗口。

这样可以保证正常的弹出新窗口,但是如果在点击事件中要先发送一个AJAX请求,根据请求结果再弹出窗口的行为在有的浏览器下仍会被拦截,如Chrome,FF

<script type="text/javascript">
openNewWindow
=function() {
$.ajax({
//发送一个ajax请求
url:ajax请求的url,
success:
function() {
//在请求返回中弹窗,有的浏览器下会被拦截
window.open(url);
}
});
}
</script>


解决思路有下面两种:

1.openNewWindow中先弹出一个空白窗口,待AJAX请求返回再修改弹出window的url。

2.不用ajax直接OPEN要请求的URL,然后由服务器来判断重定向到要open的URL。

这两种方法都会导致窗口出现较长时间的白页,而且如果最后请求结果是不需要弹窗的时候就需要关闭该窗口,就会是一个白页闪了一下,用户体验很不好。所以应该尽量避免在ajax请求返回中弹窗。


二. IE6下回传值问题

看下面的例子,例子中弹出的窗口页面会调用父页面的callBackFun方法,然后将自己关闭。

newWindow.html

<script type="text/javascript">
onload
=function(){
window.opener.callBackFun({
'msg' : 'hahhaha'});
self.close(); //方法调用后关闭自身窗口
}
</script>

主页面:

<script type="text/javascript">
$showlog
=function( msg ){
var el = document.getElementById( 'log' );
el.innerHTML
= el.innerHTML +'<br/>'+ msg;
}
openNewWindow
=function() {
window.open(
"./newWindow.html");
}
callBackFun
=function( obj ){
//正常打印
$showlog(obj.msg);
//延时保证在窗口关闭之后执行
setTimeout(function(){
//当打开的窗口被关闭之后访问obj.msg,IE6下会直接报错
$showlog(obj.msg);
},
1000);
}
</script>

<button onclick="openNewWindow()">弹出窗口</button>
<div id="log"></div>

当接收到的参数为引用类型时,如果弹出窗口被关闭,IE6下主页面接收到的数据也会被回收掉。此时判断obj是存在的,但是尝试访问obj.msg时就会出错,没任何提示。所以如果有这种使用场景应先对obj进行深度复制。

 

三.页面不能解gzip的问题

IE6下window.open打开的页面如果同时进行了cache和gzip压缩,会导致页面偶发的出现白页不解析的情况。这时其实页面已经正常获取到了,只是由于未解开gzip压缩导致的。解决方法就是调整输出的头信息(cache和gzip)。

header('Cache-Control: post-check=0, pre-check=0');
header('Pragma: ');

这是IE6的一个BUG,不只出现在window.open的时候,只是我在这种情况下遇到了而已。可以参考下面的文章

http://blog.sina.com.cn/s/blog_4dd475390100qci5.html


四.如何判断弹出窗口已关闭

window.open会返回一个弹出窗口的句柄,该句柄有一个 closed 属性,当窗口被关闭时值为true,否则为false。但是在IE下会有个BUG,窗口被关闭之后 closed属性并没有立即被设置为true。所以应不断的检测closed属性直到为true才可以确认窗口已关闭。虽然为false时也可能已经被关闭了。下面页面是IE下的错误表述

http://support.microsoft.com/kb/241109

 

五.IE7下设置所有页面都在新标签页中打开导致的返回值问题

大多数时候我们通过下面的代码来判断弹出窗口是否成功,如果成功会返回弹出窗口的引用,失败会返回null。

var _win=window.open(url);
if(!_win){
//弹出失败,重定向当前页面到url
}else{
//弹出成功
}

但是如果在IE7下开启了所有页面都在新标签页中打开,window.open就算执行成功也不会返回新窗口引用。至于有什么影响你懂的。

 

 

 

 



 



转载于:https://www.cnblogs.com/feng_013/archive/2011/09/27/2175009.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/434851.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VC的MySQL编程

一、在你的程序中使用数据库是不错的注意。如果已经有可用的MySQL服务器&#xff0c;在VC中可以按照如下方法实现与数据库的连接。 1、找来MySQL(Win32)安装目录下的include文件夹&#xff0c;将其添加到VC头文件目录列表中&#xff1b; &#xff08;VC6 -> Options -> D…

python免费学校_清华大学,的python学习路线,免费分享给小白福利

python应该是近几年比较火的语言之一&#xff0c;很多人刚学python不知道该如何学习&#xff0c;尤其是没有编程基础想要从事程序员工作的小白&#xff0c;想必应该都会有此疑惑&#xff0c;包括我刚学python的时候也是通过从网上查找相关资料以及从学校课程学习才确定python学…

mapgis转shp左右位置偏差

问题描述 问题原因 一般情况下&#xff0c;投影中心经度不会出现这么复杂的数字&#xff0c;一般都是1110000&#xff0c;1170000&#xff0c;前3个数字为整数后四个数字为0 问题解决 主要思想&#xff1a;通常相差的经纬度&#xff0c;调整投影中心点经度 解决步骤 1.试图…

Oracle Database Appliance

转载&#xff1a;http://www.hellodb.net/2011/09/oracle-database-appliance.html自从Oracle收购了SUN&#xff0c;不仅仅得到了MySQL&#xff0c;Java&#xff0c;Solaris等&#xff0c;还得到了SUN的硬件产品&#xff0c;真正成为了一家软硬通杀的服务提供商。这几年&#x…

arcgis中的插值分析了解

1.前言 打开arcgis工具箱我们可以发现arcgis为我们提供了多种插值分析的工具&#xff0c;克里金插值、反距离权重插值、样条函数插值等&#xff0c;具体如图所示 在工具箱中除地形转栅格和通过文件实现地形转栅格是用来绘制dem数据&#xff0c;其他就是我们日常研究所用的插值工…

gcovr 安装_Kudu 1.8.0 编译安装配置

安装环境&#xff1a;CentOS6.8*3解决系统依赖&#xff1a;yum install autoconf automake cyrus-sasl-devel cyrus-sasl-gssapi cyrus-sasl-plain flex gcc gcc-c gdb git java-1.8.0-openjdk-devel krb5-server krb5-workstation libtool make openssl-devel patch pkgconfig…

关于Outlook删除原邮箱邮件的解决办法

最近需要用邮件多一些&#xff0c;就配置了一下Outlook客户端&#xff0c;配置的时候一般直接点下一步&#xff0c;自动配置就可以了&#xff0c;我也试过手动配置&#xff0c;解决老是出问题。别说&#xff0c;Outlook用起来还是相当方便的&#xff0c;不用每次都打开浏览器输…

解决MAPGIS导出数据乱码

所需软件&#xff1a; MAPGIS6.7 MAPGIS10版本以上 MAPGIS开发入门向导手册.zip-行业报告文档类资源-CSDN下载MAPGIS开发入门向导手册.zip更多下载资源、学习资料请访问CSDN下载频道.https://download.csdn.net/download/qq_39397927/85321238ArcGIS 问题描述 在mapgis中的…

r语言中的或怎么表示什么不同_s语言和r语言有什么区别

展开全部一、用法不同1、S语言&#xff1a;S语言用来进行数据探索、统计分析、作图的解释型语62616964757a686964616fe58685e5aeb931333431366261言。2、R语言&#xff1a;R是自由软件&#xff0c;是一种可编程的语言。二、开发人员不同1、S语言&#xff1a;语言是由AT&T贝…

AsyncTask的用法

在开发Android应用时必须遵守单线程模型的原则&#xff1a; Android UI操作并不是线程安全的并且这些操作必须在UI线程中执行。在单线程模型中始终要记住两条法则&#xff1a; 1. 不要阻塞UI线程 2. 确保只在UI线程中访问Android UI工具包 当一个程序第一次启动时&#x…

突破select的FD_SETSIZE限制

前言&#xff1a; 在很多比较各种网络模型的文章中&#xff0c;但凡提到select模型时&#xff0c;都会说select受限于轮询的套接字数量&#xff0c;这个 数量也就是系统头文件中定义的FD_SETSIZE值(例如64)。但事实上这个算不上真的限制。 C语言的偏方&#xff1a; 在C语…

袋装树和随机森林的区别

装袋法建树的时候是将所有预测变量都考虑进去&#xff0c; 而随机森林则是考虑每一个分裂点时&#xff0c;都是从所有的预测变量p中随机选取m个预测变量&#xff0c;分裂点所用的预测变量只能从这m个变量中选择。

如何导入maven源文件_如何正确导入maven项目到eclipse?

Eclipse不允许一个项目被导入不止一次,在您的情况下,来自中继线和分支.This article显示了如何通过自定义maven配置文件绕过此限制.基本上,步骤是&#xff1a;>将以下配置文件添加到您的父pom.xml中append-to-project-nameappend.to.project.namemaven-eclipse-plugin[artif…

画廊效果

http://www.no3dfx.com/polaroid/ 转载于:https://www.cnblogs.com/bearhb/archive/2011/10/12/2208162.html

python镜像

Python国内镜像地址&#xff1a; 1.阿里云&#xff1a;https://mirrors.aliyun.com/pypi/simple/ 2.豆瓣&#xff1a;https://pypi.douban.com/simple/ 3.清华大学&#xff1a;https://pypi.tuna.tsinghua.edu.cn/simple/ 4.中国科学技术大学 http://pypi.mirrors.ustc.edu.cn/…

socket 编程入门教程(一)TCP server 端:3、sockaddr与sockaddr_in

收件人地址一家化妆品公司将一批新产品的样品&#xff0c;准备发给某学校某个班的女生们免费试用。通常情况下&#xff0c;这件邮包的地址上可以这么写&#xff1a;收件人&#xff1a;全体女生。 地址&#xff1a;A省B市C学校&#xff0c;X级Y班。但是&#xff0c;如果在描述地…

python语言为什么叫python_Python为什么叫Python,Java又如何而来?

你可能听过这样一种说法&#xff1a;在计算机科学领域&#xff0c;只有两件困难的事情&#xff0c;其中一件是给事物命名。有些编程语言的名字很有意义&#xff0c;比如谷歌(Google)将它的编程语言命名为Go(lang)&#xff0c;而其他的名字——比如Python和Java——为什么要这么…

arcgis中的SetNull(,)函数使用

SetNull(设置条件&#xff0c;将条件之内的值变为nodata,条件之外的值处理) 例如&#xff1a; 1.setnull("DEM"500,"DEM"),将DEM中值为500的数据赋为空&#xff0c;其他保留原值 2.setnull("DEM">500,"DEM"),将DEM中值大于500的…

pyqt5设置dialog的标题_PyQt5快速上手基础篇7-弹出dialog

前言本节我们学习QDialog的使用&#xff0c;在主页面点击按钮弹出一个新的Dialog。一、基础知识1. dialog简介窗口是GUI设计中不可获取的一部分&#xff0c;方便用户和程序直接交互&#xff0c;简化使用&#xff1b;Qdialog主要包含QInputDialog、QColorDialog、QFontDialog、Q…

67、ulimit的使用

1、ulimit set or get the shells resource usage limits ulimit [OPTIONS] [LIMIT] 2、option ① -a 显示当前所有的资源限制。 ② -c size:设置core文件的最大值。单位:blocks ③ -n size 指定同一时间最多可开启的文件数 ④ -l size:设置在内存中锁定进程的最大值。单位:KB…