js弹出窗口和对话框

来源:互联网 发布:java正则替换字符串 编辑:程序博客网 时间:2024/05/16 06:25

(好东西,大家分享)

 

js概述:Window对象是客户端javascript最高层对象之一,只要打开浏览器窗口,不管该窗口中是否有打开的网页

,当遇到BODY、FRAMESET或FRAME元素时,都会自动建立window对象的实例。另外,该对象的实例也可由

window.open()方法创建。由于window对象是其它大部分对象的共同祖先,在调用window对象的方法和属

性时,可以省略window对象的引用。例如:window.document.write()可以简写成: document.write()。

  在窗口中觖发本窗口对象的任何方法和属性时可以省去窗口的实例名称。例如给当前的myWin窗口设置

status属性时,可以只用status而不用myWin.status。但是,在事件处理中调用location属性、close()

方法或open()方法时必须使用实例名称。

window对象和方法一览:
它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口。

   属性======
  defaultStatus 缺省的状态条消息
    status 状态条中的消息
    statusbar
    statusbar.visible
  document 当前显示的文档(该属性本身也是一个对象)
  frames列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个对象

)
  history 窗口的历史列表(该属性本身也是一个对象)
  length 窗口内的框架数
  location 窗口所显示文档的完整(绝对)URL(该属性本身也是一个对象)不要把它与如

document.location混淆,后者是当前显示文档的URL。用户可以改变window.location(用另一个文档取代

当前文档),但却不能改变document.location(因为这是当前显示文档的位置)
  name 窗口打开时,赋予该窗口的名字
  opener 代表使用window.open打开当前窗口的脚本所在的窗口(这是Netscape Navigator 3.0beta 3

所引入的一个新属性)
  parent 包含当前框架的窗口的同义词。frame和window对象的一个属性
  self 当前窗口或框架的同义词
  
  top 包含当前框架的最顶层浏览器窗口的同义词
  window 当前窗口或框架的同义词,与self相同
    event
  
 
    方法======
  alert() 打开一个Alert消息框
  clearTimeout() 用来终止setTimeout方法的工作
  close() 关闭窗口
  confirm() 打开一个Confirm消息框,用户可以选择OK或Cancel,如果用户单击OK,该方法返回true,单

击Cancel返回false
  blur() 把焦点从指定窗口移开(这是Netscape Navigator 3.0 beta 3引入的新方法)
  focus() 把指定的窗口带到前台(另一个新方法)
  open() 打开一个新窗口
  prompt() 打开一个Prompt对话框,用户可向该框键入文本,并把键入的文本返回到脚本
  setTimeout() 等待一段指定的毫秒数时间,然后运行指令事件处理程序

比较常用的方法:
alert/:alert('----'); 无返回
promote/
confirm/ confirm('确定退出吗?')  点击确定返回true,取消返回false
setTimeout/ setTimeout(fucntion,10) 推迟10毫秒,执行function
clearTimeout/ 用法clearTimeout(fucntion)
setInterval/ window.setInterval(代码字符表达式,10) 每间隔10秒执行一次指定的表达式
clearInterval clearInterval(function)

注意:上面的setTimeout和setInterval的第一个参数都可以是字符串,也可以是指针,如果是字符串,

则行如“function()”,如果用指针,则只写function名称,不用带后面的括号
使用清楚函数时,clearTimeout,clearInterval的参数是定时器,也就是上面两个函数的返回值,因此

调用如下:
var im = setInterval("function1()",5000);
clearInterval(im);(setTimeout调用完全一样)

 

js的弹出窗口:
方法:window.open(url,name,dialogattrs) 第二、三参数不是必需的
作用:打开一个新窗口,名为name,窗体内容是url,窗口参数为dialogattrs
参数说明:
url:弹出页面地址
name:窗口名称
dialogattrs:窗口的样式控制参数

窗口风格有以下选项,这些选项可以多选,如果多选,各选项之间用逗号分隔:
toolbar:指定窗口是否有标准工具栏。当该选项的值为1或yes时,表示有标准
工具栏,当该选项的值为0或no时,表示没有标准工具栏;
location:指定窗口是否有地址工具栏,选项的值及含义与toolbar相同;
directories:指定窗口是否有链接工具栏,选项的值及含义与toolbar相同;
status:指定窗口是否有状态栏,选项的值及含义与toolbar相同;
menubar:指定窗口是否有菜单,选项的值及含义与toolbar相同;
scrollbar:指定当前窗口文档大于窗口时是否有滚动条,选项的值及含义与toolbar相同;
resizable:指定窗口是否可改变大小,选项的值及含义与toolbar相同;
width:以像素为单位指定窗口的宽度,已被innerWidth取代;
height:以像素为单位指定窗口的高度,已被innerHeight取代;
outerWidth:以像素为单位指定窗口的外部宽度;
outerHeight:以像素为单位指定窗口的外部高度;
left:以像素为单位指定窗口距屏幕左边的位置;
top:以像素为单位指定窗口距屏幕顶端的位置;
alwaysLowered:指定窗口隐藏在所有窗口之后,选项的值及含义与toolbar相同;
alwaysRaised:指定窗口浮在所有窗口之上,选项的值及含义与toolbar相同;
dependent:指定打开的窗口为当前窗口的一个子窗口,并随着父窗口的关闭而关闭,选项的值及含义与

toolbar相同;

hotkeys:在没有菜单栏的新窗口中设置安全退出的热键,选项的值及含义与toolbar相同;

innerHeight:设定窗口中文档的像素高度;

innerWidth:设定窗口中文档的像素宽度;

screenX:设定窗口距离屏幕左边界的像素长度;

screenY:设定窗口距离屏幕上边界的像素长度;

titleBar:指明标题栏是否在新窗口中可见,选项的值及含义与toolbar相同;

z-look:指明当窗口被激活时,不能浮在其它窗口之上,选项的值及含义与toolbar相同。
例:window.open('test.html','testwindow','')

 

js中的对话框:
js的对话框分为模式对话框(必须关闭对话框才能继续才做)和非模式对话框(无限制)
模式对话框语法:
window.showModalDialog(url,args,dialogattrs)
参数说明:
url:弹出页面地址
agrs:主窗口传给对话框的参数,可以是任意类型(数组也可以)
dialogattrs:弹出窗口的样式参数

简单说明:
1、第二、三个参数都不是必需的
2、agrs参数可以在对话框中通过window.dialogArguments获取,即:

varargus=window.dialogArguments;然后就可以根据实际要求对此进行处理;
3、dialogattrs
可选参数,类型:字符串。用来描述对话框的外观等信息,可以使用以下的一个或几个,用分号“;”隔

开。
 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。
4、函数有返回值

模式对话框用法:
主窗口:var value =window.showModalDialog('test.jsp',strs,'resizable:yes');
弹出框中通过window.returnValue来设置返回值,上面的value拿到的就是这个值,然后主窗口中可以对

这个值进行处理,实现交互处理
注:模式对话框的应用就在于它的返回值,可以返回简单字符窜,也可以返回数组,非模式对话框类似

原创粉丝点击