谷歌,火狐瀏覽器不支援showModalDialog的解決方法
首先得知道window.showModalDialog()方法到底是幹嘛的,有什麼作用.
基本介紹:
showModalDialog() (IE 4+ 支援)
showModelessDialog() (IE 5+ 支援)
window.showModalDialog() 方法用來建立一個顯示HTML內容的模態對話方塊。
window.showModelessDialog() 方法用來建立一個顯示HTML內容的非模態對話方塊。
使用方法:
vReturnValue = window.showModalDialog(sURL [, vArguments] [,sFeatures])
vReturnValue = window.showModelessDialog(sURL [, vArguments] [,sFeatures])
引數說明:
sURL -- 必選引數,型別:字串。用來指定對話方塊要顯示的文件的URL。
vArguments -- 可選引數,型別:變體。用來向對話方塊傳遞引數。傳遞的引數型別不限,包括陣列等。對話方塊通過
window.dialogArguments來取得傳遞進來的引數。
sFeatures -- 可選引數,型別:字串。用來描述對話方塊的外觀等資訊,可以使用以下的一個或幾個,用分號“;”隔開。
----------------
1. dialogHeight: 對話方塊高度,不小於100px
2. dialogWidth: 對話方塊寬度。
3. dialogLeft: 離螢幕左的距離。
4. dialogTop: 離螢幕上的距離。
5. center: { yes | no | 1 | 0 } : 是否居中,預設yes,但仍可以指定高度和寬度。
6. help: {yes | no | 1 | 0 }: 是否顯示幫助按鈕,預設yes。
7. resizable: {yes | no | 1 | 0 } [IE5+]: 是否可被改變大小。預設no。
8. status: {yes | no | 1 | 0 } [IE5+]: 是否顯示狀態列。預設為yes[ Modeless]或no[Modal]。
9. scroll: { yes | no | 1 | 0 | on | off }:是否顯示滾動條。預設為yes。
然後發現在谷歌,火狐瀏覽器根本都彈不出來模態對話方塊,按F12開啟偵錯程式發現window.showModalDialog()在這兩個瀏覽器中是根本沒有定義的.
解決方法:
$(function(){ if(window.showModalDialog == undefined){ //alert("初始化的時候,判斷window.showModalDialog是否存在") window.showModalDialog = function(url,mixedVar,features){ window.hasOpenWindow = true; if(mixedVar) var mixedVar = mixedVar; if(features) var features = features.replace(/(dialog)|(px)/ig,"").replace(/;/g,',').replace(/\:/g,"="); window.myNewWindow = window.open(url,"_blank",features); } } });一載入頁面的時候,我們就判斷這個方法是否是undefined未定義的,如果是,我們給window.showModalDialog()重新賦予新的函式.
原來的寫法不變
var returnValue =window.showModalDialog(url,window,"dialogHeight:800px;dialogWidth:800px;center:yes");
子視窗的寫法
//選擇優惠券 function chooseCoupon(id) { var couponName =$('#'+id).val(); var val={id: id,name:couponName};if (window.opener != undefined) { //for chrome window.opener.returnValue = val; } else { window.returnValue = val; } //呼叫父視窗方法 opener.fuzhi(val); window.close(); }
然後遇到開啟子視窗的時候就給returnValue賦值,不統一.所以這邊換了opener.fuzhi()寫法,呼叫了父類fuzhi的函式,讓我們得到的返回值做剩下的業務操作.