弹出子页面，兼容ie

window.showModalDialog(）（兼容ie的写法）模式窗口, 一种很特别的窗口,当它打开时,后面的父窗口的活动会停止,除非当前的模式子窗口关闭了, 才能操作父窗口.在做网页Ajax开发时,我们应该有时会用到它来实现表单的填写, 或做类似网上答题的窗口. 它的特点是,传参很方便也很强大,可直接调用父窗口的变量和方法.

使用方法：
vReturnValue = window.showModalDialog(路径 ， 可选参数 ，框体的样式) ；

*注：
谷歌浏览器不支持window.showModalDialog（）方法，在谷歌浏览器中用window.open（）方法解决这个问题；

参数传递

father.html

父接受子传递的内容：
   
              点击

  function setPermission() {
        var url = "child.html";
        //居中问题
        var dialogLeftValue = screen.width / 2 - 200 + "px";    
         var returnValue;
//判断是否兼容Chrome浏览器
         if (navigator.userAgent.indexOf("Chrome") > 0) {
                var width = 600;  
                var height = 350;
                var top = (window.screen.height - 30 - height) / 2;
                var left = (window.screen.width - 30 - width) / 2;
                 window.open(url, self,"width=" + width + ",height=" + height +",top=" + top + ",left=" +left);
            }else{
                  returnValue =  window.showModalDialog(url, "", "dialogHeight:350px;dialogWidth:600px;status:0;dialogTop:100px;dialogLeft:" + dialogLeftValue);
                
            }
       
    }

child.html

    
        
        
    
        
    
      
           子传向父的内容： 
   
              点击
    
    
    
    
    

子页面获取父页面的标签，并将自己的值赋值给父元素。

1：子页面获取父页面传入的值需要加前缀兼容ie的写法：
ie获取父元素标签 :window.dialogArguments.document.getElementsByName("txt10")[0].value；
其他浏览器（主要是chrome）,获取父元素标签:
window.opener.document.getElementsByName("txt10")[0].value;
2：子页面传值给父页面兼容ie的写法：（需要借助步骤1的获取方法，其实就是子页面的值传递给父页面）
if (navigator.userAgent.indexOf("Chrome") > 0){
//其他浏览器的写法
window.opener.document.getElementsByName("txt10")[0].value = document.getElementById("txt0").value
}else{
//IE浏览器的写法
window.dialogArguments.document.getElementsByName("txt10")[0].value = document.getElementById("txt0").value ;
}

实际应用场景

*当父页面有2个以上的地方点击弹框都是同一的时候，需要获取点击框的id，来辨别点击的谁，这个时候我们需要一个全局变量，并且这个全局变量必须添加window中，window.id= whichtable.id；
父页面中的js

function OpenSetFont(whichtable)
{
        window.fontId = whichtable.id;
    if (navigator.userAgent.indexOf("Chrome") <0){
        var mikecatstr = window.showModalDialog(url,whichtable.value ,"dialogWidth:430px;dialogHeight:300px;help:no;status:no;scrollbar:no;");
    }else{
           openwindow(url,self,430,300)
    }
    if (mikecatstr == null)
        return;
    if (mikecatstr == "Cancel")
        return;
    whichtable.value = mikecatstr;
}
function return_OpenSetFont(mikecatstr){
    if (mikecatstr == null)
        return;
    if (mikecatstr == "Cancel")
        return;
     document.getElementById(window.fontId).value=mikecatstr;           
}

子页面点击确定按钮的js

function Enter()
{
    var vFont = getFontCss();
    if (navigator.userAgent.indexOf("Chrome") <0){
        window.returnValue = vFont; 
    }else{  
        window.opener.return_OpenSetFont(vFont)
    }
    window.close(); 
}