如何编写适合FireFox的对话框?_ASP教程-查字典教程网
如何编写适合FireFox的对话框?
如何编写适合FireFox的对话框?
发布时间:2016-12-29 来源:查字典编辑
摘要:在设计Blog操作流程的时候,计划在添加页面和修改页面都用弹出对话框的方式。添加和修改结束时,点击提交,对话框关闭,同时后面的列表窗口刷新。...

在设计Blog操作流程的时候,计划在添加页面和修改页面都用弹出对话框的方式。添加和修改结束时,点击提交,对话框关闭,同时后面的列表窗口刷新。这样就感觉在用Windows的界面程序一样,界面友好性很好。

但是在实际操作的时候发生了一个问题,IE的对话框技术,对FireFox是不支持的,怎么才能做到既支持IE又支持FireFox的对话框呢?

还好,昨天在研究TinyMCE,里面有支持FireFox的对话框技术可以借鉴。

我写的打开对话框的方法:

functionpopupDialog(url,width,height){

//showx=event.screenX-event.offsetX-4-10;//+deltaX;这段代码只对IE有效,已经不用了

//showy=event.screenY-event.offsetY-168;//+deltaY;这段代码只对IE有效,已经不用了

varx=parseInt(screen.width/2.0)-(width/2.0);

vary=parseInt(screen.height/2.0)-(height/2.0);

varisMSIE=(navigator.appName=="MicrosoftInternetExplorer");//判断浏览器

if(isMSIE){

retval=window.showModalDialog(url,window,"dialogWidth:"+width+"px;dialogHeight:"+height+"px;dialogLeft:"+x+"px;dialogTop:"+y+"px;status:no;directories:yes;scrollbars:no;Resizable=no;");

}else{

varwin=window.open(url,"mcePopup","top="+y+",left="+x+",scrollbars="+scrollbars+",dialog=yes,modal=yes,width="+width+",height="+height+",resizable=no");

eval('try{win.resizeTo(width,height);}catch(e){}');

win.focus();

}

}

在被打开的对话框里,我是用了上下分Frame的页面,因为在IE里,对话框是不可以提交的,但是分成Frame后,就可以提交了。

在提交的按钮上,加上这段代码:

functiondoReload(){

varisMSIE=(navigator.appName=="MicrosoftInternetExplorer");

if(isMSIE){

parent.dialogArguments.location.reload();

}else{

parent.opener.document.location.reload();

}

top.close();

}

两种浏览器的打开对话框的方式不一样

IE:window.showModalDialog(url,window,"dialogWidth:300px;dialogHeight:300px;dialogLeft:200px;dialogTop:200px;status:no;directories:yes;scrollbars:no;Resizable=no;");

FireFox:window.open(url,"mcePopup","top=200,left=200,scrollbars=no,dialog=yes,modal=yes,width=300,height=300,resizable=no");

关闭窗口时:

IE:parent.dialogArguments.location.reload();

FireFox:parent.opener.document.location.reload();

还有一个很重要的注意点。FireFox好像不支持对话框的window.close();

所以最后使用的关闭窗口用的是top.close();这个IE、FireFox都支持。

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新ASP教程学习
    热门ASP教程学习
    编程开发子分类