thanks for your help,my friends!
I'm redesign a web site to be compatible with Safari.
20% customers use safari & firefox and 80% customers use IE on windows.
I google for: showModalDialog replacement
or: showModalDialog alternative
I find a way but it's unwork on safari.
In parent window ,we can add a function on onfocus event of the html body element. When the parent window is selected , the event will call a function.In the function, if child window is open, the function will focus on the child window.
the code is:
<html>
<head>
<script language="JavaScript1.2" type="text/javascript">
dFeatures = 'dialogHeight: 450px; dialogWidth: 1049px; dialogTop: 646px; dialogLeft: 4px; edge: Raised; center: Yes; help: Yes; resizable: Yes; status: Yes;';//default features
modalWin = "null";
function xShowModalDialog( sURL, vArguments, sFeatures )
{
if (sURL==null||sURL=='')
{
alert ("Invalid URL input.");
return false;
}
if (vArguments==null||vArguments=='')
{
vArguments='';
}
if (sFeatures==null||sFeatures=='')
{
sFeatures=dFeatures;
}
alert("window.navigator.appVersion="+window.navigator.appVersion);
if (window.navigator.appVersion.indexOf("MSIE")!=-1)
{
window.showModalDialog ( sURL, vArguments, sFeatures );
return false;
}
sFeatures = sFeatures.replace(/ /gi,'');
aFeatures = sFeatures.split(";");
sWinFeat = "directories=0,menubar=0,titlebar=0,toolbar=0,";
for ( x in aFeatures )
{
aTmp = aFeatures[x].split(":");
sKey = aTmp[0].toLowerCase();
sVal = aTmp[1];
switch (sKey)
{
case "dialogheight":
sWinFeat += "height="+sVal+",";
pHeight = sVal;
break;
case "dialogwidth":
sWinFeat += "width="+sVal+",";
pWidth = sVal;
break;
case "dialogtop":
sWinFeat += "screenY="+sVal+",";
break;
case "dialogleft":
sWinFeat += "screenX="+sVal+",";
break;
case "resizable":
sWinFeat += "resizable="+sVal+",";
break;
case "status":
sWinFeat += "status="+sVal+",";
break;
case "center":
if ( sVal.toLowerCase() == "yes" )
{
sWinFeat += "screenY="+((screen.availHeight-pHeight)/2)+",";
sWinFeat += "screenX="+((screen.availWidth-pWidth)/2)+",";
}
break;
}
}
modalWin=window.open(String(sURL),"",sWinFeat);
if (vArguments!=null&&vArguments!='')
{
modalWin.dialogArguments=vArguments;
}
}
function checkFocus()
{
try{
if (window.navigator.appVersion.indexOf("MSIE")==-1)
{
if (modalWin!="null")
{
if(!modalWin.closed){
self.blur();
modalWin.focus();
}
}
}
}catch(e){alert(e);}
}
</script>
</head>
<body onFocus="checkFocus();">
<br>
<br>
<input type="button" onclick="javascript:xShowModalDialog('aaa.html',this,'');" value="click">
</body>
</html>
the code can work on IE6.0 & firefox , but not work on safari!
I find in the SafariHTMLRef(http://developer.apple.com/documentation/AppleApplications/Reference/SafariHTMLRef) & SafariJSRef(http://developer.apple.com/documentation/AppleApplications/Reference/SafariJSRef)
.the are the discript of onFocus events,
onFocus
<element onFocus="handler(args);" ...>
Discussion
Called when the associated element receives keyboard input focus.Can only be used with elements
that can receive keyboard input such as <input>,<textarea>,or<select>.
Availability
Availablein MacOSXv10.2withSafari1.0and later.
Availablein MacOSXv10.2.7andlater.
It's the answer that onfocus can't work on safari , the onfocus events only receives the keyboard input, so this way can't replace the showmodaldialog method.
I try to use onMouseOver event to replace onFocus event, but find it faults:
onMouseOver event can be called and focus on the child window,but the button on parent window can still be clicked ,it's not modal.
the problem is still not sovled.
If you have a good idea, please help me!
Thanks for your help!
