代码改变世界

今日工作心得:模态窗口的问题

2010-08-03 12:22  于为源  阅读(2168)  评论(0编辑  收藏  举报

今天用到了模态窗口,说实话觉得模态窗口的效果确实不应是首选,使用javascrpit+div模拟才是不错的选择,但是为了赶时间图省事,还是选择了模态窗口。以前对模态窗口了解的并不是很多,今天借这个机会自己给自己总结一下。

1.使用方法:

vreturnvalue = window.showmodaldialog(surl [, varguments] [, sfeatures])
 vreturnvalue = window.showmodelessdialog(surl [, varguments] [, sfeatures])
参数说明:
 surl
 必选参数,类型:字符串。用来指定对话框要显示的文档的url。
 varguments
 可选参数,类型:变体。用来向对话框传递参数。传递的参数类型不限,包括数组等。对话框通过window.dialogarguments来取得传递进来的参数。
 sfeatures
 可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔开。
  dialogheight 对话框高度,不小于100px,ie4中dialogheight 和 dialogwidth 默认的单位是em,而ie5中是px,为方便其见,在定义modal方式的对话框时,用px做单位。
   dialogwidth: 对话框宽度。
   dialogleft: 距离桌面左的距离。
   dialogtop: 离桌面上的距离。
   center: {yes | no | 1 | 0 }:窗口是否居中,默认yes,但仍可以指定高度和宽度。
   help: {yes | no | 1 | 0 }:是否显示帮助按钮,默认yes。
   resizable: {yes | no | 1 | 0 } [ie5+]:是否可被改变大小。默认no。
   status: {yes | no | 1 | 0 } [ie5+]:是否显示状态栏。默认为yes[ modeless]或no[modal]。
  scroll:{ yes | no | 1 | 0 | on | off }:指明对话框是否显示滚动条。默认为yes。

 

  还有几个属性是用在hta中的,在一般的网页中一般不使用。
  dialoghide:{ yes | no | 1 | 0 | on | off }:在打印或者打印预览时对话框是否隐藏。默认为no。
  edge:{ sunken | raised }:指明对话框的边框样式。默认为raised。
  unadorned:{ yes | no | 1 | 0 | on | off }:默认为no。

2.在ie8中如果再模态窗口中提交表单会弹出一个新页面,为了避免这个问题需要:

在<title></title>标签后加上<base target="_self">

我也不明白这是为什么。

3.关于滚动条的问题

一个比较郁闷的问题是:当弹出的模态窗口设置了高度和宽度时,如果出现了纵向的滚动条,那么横向的滚动条会一起出现,不管设置的宽度有多大。为了解决这个问题我采取了下面的不算高明的办法:

1.设置要弹出的页面的内容宽度为固定值(如:700px),弹出窗口的宽度值大于这个固定值(如710px)。

2.再要弹出的窗口中加上如下代码,去掉横向的滚动条:

    <style type="text/css">
        html
        {
            overflow: scroll;
            overflow-x: hidden;
        }
        body
        {
            overflow: scroll;
            overflow-x: hidden;
        }
    </style>