如何编写适合FireFox的对话框?

2016-02-19 10:13 33 1 收藏

今天图老师小编给大家展示的是如何编写适合FireFox的对话框?,精心挑选的内容希望大家多多支持、多多分享,喜欢就赶紧get哦!

【 tulaoshi.com - Web开发 】

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

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

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

我写的打开对话框的方法: 
function popupDialog(url,width,height){ 
    //showx = event.screenX - event.offsetX - 4 - 10 ; // + deltaX;  这段代码只对IE有效,已经不用了 
    //showy = event.screenY - event.offsetY -168; // + deltaY; 这段代码只对IE有效,已经不用了 

        var x = parseInt(screen.width / 2.0) - (width / 2.0);  
    var y = parseInt(screen.height / 2.0) - (height / 2.0); 
        var isMSIE= (navigator.appName == "Microsoft Internet Explorer");  //判断浏览器 

        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 { 
        var win = 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后,就可以提交了。 
在提交的按钮上,加上这段代码: 

  function doReload(){    
     var isMSIE= (navigator.appName == "Microsoft Internet Explorer"); 
     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都支持。 

来源:http://www.tulaoshi.com/n/20160219/1593807.html

延伸阅读
再谈 CFileDialog 对话框的定制 编译/NothTibet 原文出处:MSDN Magazine C++ Q&A 下载源代码         在《在线杂志》第十四期里,有一篇文章题为:“一个定制CFileDialog对话框的实例”,此文示范了如何定制“打开”文件对话...
如何有效地使用对话框 译者:徐景周(原作:VGirish) Q:如何在对话框中加入工具条 在 OnInitDialog 中加入下面代码: BOOL CYourDlg::OnInitDialog(){ CDialog::OnInitDialog(); // Create the toolbar. To understand the meaning of the styles used, you // can take a l...
如何有效的使用对话框之二 译者:徐景周(原作:Nishant S ) 本文是《如何有效使用对话框》一文的继续. 1. 如何有效地使初始窗口不显示 当我们想让窗口初始时不显示时,通常会用ShowWindow(SW_HIDE) ,但实际上还是在启动是可以看到窗口一闪而过的痕迹。所以,可以使用下面的方法来实现它: ...
(1) 参数 typedef struct { DWORD lStructSize; HWND hwndOwner; HWND hInstance; COLORREF rgbResult; COLORREF * lpCustColors; DWORD Flags; LPARAM lCustData; LPCCHOOKPROC lpfnHook; LPCTSTR lpTemplateName; } CHOOSECOLOR, *LPCHOOSECOLOR; (2) API...
使用有模式对话框时在对话框弹出后调用函数不会立即返回,而是等到对话框销毁后才会返回(请注意在对话框弹出后其他窗口的消息依然会被传递)。所以在使用对话框时其他窗口都不能接收用户输入。创建有模式对话框的方法是调用CDialog::DoModal()。下面的代码演示了这种用法: CYourView::OnOpenDlg() {       ...

经验教程

41

收藏

31
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部