网站主流服务器语言,宁波中科网站建设有限公司,优化网站排名茂名厂商,深圳市住房和建设局工程交易服务中心前端开发中经常要用到 window.open 弹出一个新窗口来进行交互#xff0c;但是在使用过程中却会碰到各种各样的问题#xff0c;下面是我在平时开发过程中碰到的一些问题。 对于winodw.open的使用可以先看下这个文章 http://www.w3help.org/zh-cn/causes/BX1053 一.浏览器拦截…前端开发中经常要用到 window.open 弹出一个新窗口来进行交互但是在使用过程中却会碰到各种各样的问题下面是我在平时开发过程中碰到的一些问题。 对于winodw.open的使用可以先看下这个文章 http://www.w3help.org/zh-cn/causes/BX1053 一.浏览器拦截 由于各种弹出广告的滥用现在各个浏览器对window.open的使用都进行了严格的限制还有各种的弹出窗口拦截器稍不留神就会导致window.open方法被拦截。 下面这种脚本自动触发的弹窗行为将会被浏览器拦截掉。 script typetext/javascript//将会被拦截window.open(url);/script 那么我们该如何正确的弹出窗口呢其实只要把弹出窗口的函数绑定到鼠标的onclick事件上浏览器就会认为这是一个合理的open不会进行拦截。 script typetext/javascriptopenNewWindow function() { window.open(url);}/scriptbutton onclickopenNewWindow()弹出窗口/button 或者你可以将弹出窗口函数绑定到document.body上只要用户在页面上进行点击就会弹出窗口。 这样可以保证正常的弹出新窗口但是如果在点击事件中要先发送一个AJAX请求根据请求结果再弹出窗口的行为在有的浏览器下仍会被拦截如ChromeFF script typetext/javascriptopenNewWindow 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 typetext/javascriptonload function(){ window.opener.callBackFun({ msg : hahhaha}); self.close(); //方法调用后关闭自身窗口}/script 主页面: script typetext/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);}/scriptbutton onclickopenNewWindow()弹出窗口/buttondiv idlog/div 当接收到的参数为引用类型时如果弹出窗口被关闭IE6下主页面接收到的数据也会被回收掉。此时判断obj是存在的但是尝试访问obj.msg时就会出错没任何提示。所以如果有这种使用场景应先对obj进行深度复制。 三.页面不能解gzip的问题 IE6下window.open打开的页面如果同时进行了cache和gzip压缩会导致页面偶发的出现白页不解析的情况。这时其实页面已经正常获取到了只是由于未解开gzip压缩导致的。解决方法就是调整输出的头信息cache和gzip。 header(Cache-Control: post-check0, pre-check0);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 _winwindow.open(url);if(!_win){//弹出失败,重定向当前页面到url}else{//弹出成功} 但是如果在IE7下开启了所有页面都在新标签页中打开window.open就算执行成功也不会返回新窗口引用。至于有什么影响你懂的。 转载于:https://www.cnblogs.com/feng_013/archive/2011/09/27/2175009.html
