window.showModalDialog与window.open()使用

window.showModalDialog 有些浏览器不兼容,尝试用window.open() 封装替代,需要打开子窗口后向父窗口传递数据。





Test dialog

 
 


子窗口返回数据:

window.returnvalue

window.open 代替showModalDialog

页面A.htm 用 window.open方式弹出页面 B.htm 。
在页面B.htm上选择一个值,确定关闭窗口后将选择的这个值返回到父窗口A.htm。
A.htm得到返回的值后,给本页面上的文本框赋值。

A.html






Test dialog

B.html






B 

  


 


另外一个封装方法

modal.js

var has_showModalDialog = !!window.showModalDialog;//定义一个全局变量判定是否有原生showModalDialog方法
if(!has_showModalDialog &&!!(window.opener)){        
    window.onbeforeunload=function(){
        window.opener.hasOpenWindow = false;        //弹窗关闭时告诉opener:它子窗口已经关闭
    }
}
//定义window.showModalDialog如果它不存在
if(window.showModalDialog == undefined){
    window.showModalDialog = function(url,mixedVar,features){
        if(window.hasOpenWindow){
            alert("您已经打开了一个窗口!请先处理它");//避免多次点击会弹出多个窗口
            window.myNewWindow.focus();
        }
        window.hasOpenWindow = true;
        if(mixedVar) var mixedVar = mixedVar;
        //因window.showmodaldialog 与 window.open 参数不一样,所以封装的时候用正则去格式化一下参数
        if(features) var features = features.replace(/(dialog)|(px)/ig,"").replace(/;/g,',').replace(/\:/g,"=");
        //window.open("Sample.htm",null,"height=200,width=400,status=yes,toolbar=no,menubar=no");
        //window.showModalDialog("modal.htm",obj,"dialogWidth=200px;dialogHeight=100px"); 
        var left = (window.screen.width - parseInt(features.match(/width[\s]*=[\s]*([\d]+)/i)[1]))/2;
        var top = (window.screen.height - parseInt(features.match(/height[\s]*=[\s]*([\d]+)/i)[1]))/2;
        window.myNewWindow = window.open(url,"_blank",features);
    }
}

A.html 父页面






    

Test dialog

内容哈哈哈

B.html页面:






    

B 

  


 



相关文章:
高版本chrome不再支持window.showmodaldialog 的临时替换方案【用window.open】

你可能感兴趣的:(windows,html)