您的位置:首页 > Web前端 > HTML

html关闭浏览器事件

2015-04-06 17:41 127 查看
关闭浏览器的事件 

2008-07-15 15:38:22|  分类: [JavaScript]|举报|字号 订阅

在做图片刷新功能的时候,会出现IE图片缓存的问题,试了N多方法都没有效果,最后只有使用每刷新一次修改图片文件名加随机数的方法才勉强解决。但是这样的方法是下次打开浏览器读取图片的时候,上次产生的随机数是动态的,这时候只有让用户关闭浏览器的时候捕捉关闭事件然后将图片更名为一个统一的名字。由于浏览器是无状态的,在这时候捕捉浏览器关闭会出现两种情况:1.真正的关闭浏览器 2.刷新浏览器。如何判断区分这两种动作呢。

一. Javascript代码处理方法:

      function window.onbeforeunload()  

      {       

        //用户点击浏览器右上角关闭按钮

        if(event.clientX>document.body.clientWidth&&event.clientY<0||event.altKey)  

        {  

                document.getElementById("btnCompelete").click();

//              window.event.returnValue="确定要退出本页吗?";  

        }

        //用户点击任务栏,右键关闭

        else if(event.clientY > document.body.clientHeight || event.altKey)

        {

            document.getElementById("btnCompelete").click();

//            window.event.returnValue="确定要退出本页吗?";  

        }

         else//其他情况为刷新  

         {  

              alert("你在刷新");

         }  

      }

其中 event.clientX   鼠标光标X坐标     document.body.clientWidth窗体工作区宽度     event.clientY鼠标光标Y坐标     event.altKey   是否按下alt键

二. 事件捕捉方法:

<body scroll="no" onbeforeunload="return CloseEvent();" onunload="UnLoadEvent()" >

</body>

<script language="JavaScript" type="text/javascript">

  

    var DispClose = true;

    function CloseEvent()

    {

        if (DispClose)

        {

            return "是否离开当前页面?";

        }

    }

   

    function UnLoadEvent()

    {

        DispClose = false;

        //在这里处理关闭页面前的动作

    }

在页面卸载之前引发onbeforeunload事件,如果用户选择“是”即确定卸载页面将引发onunload事件,否则返回页面不做任何操作。

 

怎么退出整个框架

如:

<frameset rows= "74,*,0,0 " cols= "* " frameborder= "NO " border= "0 " framespacing= "0 ">

<frame src= "top.aspx " name= "topFrame " scrolling= "NO " noresize >

<frameset cols= "200,* " frameborder= "NO " border= "0 " framespacing= "0 ">

<frame src= "left.aspx " name= "leftFrame " scrolling= "NO " noresize>

<frame src= "mainFrame.aspx " name= "mainFrame ">

</frameset>

<noframes>

最简单的方法:

Response.Write( " <script> parent.window.location.href= 'default.aspx ' </script> ");

<a href="javascript:parent.window.location.href= '../Index.aspx ';"><span>退出登录</span></a>

详细介绍:

1. 下面的表格列出了 window 对象某些属性的相关信息。  

2. 属性 方法 描述  

3. opener open opener 属性仅在使用 window.open 方法打开的页面中可用。  

4. parent, top 无 parent 和 top 属性对 frame 或 iframe 内打开的窗口可用。这两个属性分别返回立即父窗口和最上层的祖先窗口。  

5. parent, top open parent 和 top 属性对于通过 open 方法打开或以对话框打开并返回到当前窗口的窗口可用。  

6. length 无 不管窗口是怎么打开的,length 属性总是返回窗口中的框架数目。  

7. dialogArguments, dialogHeight, dialogLeft, dialogTop, dialogWidth, returnValue showModalDialog 和 showModelessDialog  

8.  

9.  

10. parent 获取对象层次中的父窗口。  

11.  

12. top 获取最顶层的祖先窗口。  

13.  

14. ****************************************************************  

15. 1、直接从框架页中退出,并转向到新的窗口  

16. if (Session["admin"] == null)  

17.          {  

18.              Response.Write("<script language=javascript>alert('登陆超时,请重新登陆!!')</script>");  

19.              Response.Write("<script language=javascript>top.location.href='../news/manager/login.aspx'</script>");  

20.          }  

21.  

22. 2、如果需要在框架页中关闭当前窗口并打开新窗口  

23. 1)先提示关闭当前窗口,并且在确定关闭当前窗口后,打开新窗口.  

24. if (Session["admin"] == null)  

25.          {  

26.              Response.Write("<script language=javascript>alert('登陆超时,请重新登陆!!')</script>");  

27.              Response.Write("<script>window.parent.close(); window.open('../news/manager/login.aspx');</script>");          

28.         }  

29. 同样的效果:  

30. if (Session["admin"] == null)  

31.          {  

32.              Response.Write("<script language=javascript>alert('登陆超时,请重新登陆!!')</script>");  

33.              Response.Write("<script>window.opener=null;top.window.close();</script>");  

34.         }  

35. 3、在框架中关闭当前窗口,不提示。并且打开新窗口  

36. if (Session["admin"] == null)  

37.          {  

38.              Response.Write("<script language=javascript>alert('登陆超时,请重新登陆!!')</script>");  

39.              Response.Write("<script>window.open('../news/manager/login.aspx');top.close();</script>");         

40.           }  

41.  

42.  

43.         if (Session["admin"] == null)  

44.          {  

45.              Response.Write("<script language=javascript>alert('登陆超时,请重新登陆!!')</script>");  

46.              Response.Write("<script language=javascript>parent.location.href='../airquery/Admin-manager/index.asp'</script>");  

47.  

48.              Response.Write("<script language=javascript>window.open('../airquery/Admin-manager/index.asp');opener=null;top.close();</script>");  

49.          }  

50.  

51.  

52. window属性:  

53.  

54. opener 设置或获取创建当前窗口的窗口的引用。  

55. self 获取对当前窗口或框架的引用。  

56.  

57. windown方法:  

58.  

59. close 关闭当前浏览器窗口或 HTML 应用程序(HTA)。  

60. open 打开新窗口并装入给定 URL 的文档。  

61.  

62. 简单总结一下:  

63.  

64. 两句任意选一句都可完成表面上类似同样的效果。  

65. 但是实际效果上的差别:  

66. Response.Write("<script language=javascript>parent.location.href='../airquery/Admin-manager/index.asp'</script>");  

67. 这里将parent换成top也可以,没仔细研究为什么。自己使用。我在我的框架里top,left.right(三个框架的right使用无任何问题)  

68. 这个是直接转向到新页面,但是地址栏上的后退仍然是可以后退的,虽然点后退会在次返回,可是如我上面的写法,在page_load里,会再次提示“登陆超时,请重新登陆”确定后再返回。这样的效果,我不是很满意,所以得出了下面的使用方法。  

69. Response.Write("<script language=javascript>window.open('../airquery/Admin-manager/index.asp');opener=null;top.close();</script>");  

70. 这个的功能是什么实际效果呢?很简单,打开新窗口后,接下来,将原来的框架窗口关闭,注意是新窗口,那么当然后退按钮就变成灰色的了。客户端自然无法后退了。这个效果我比较喜欢。很符合我的原意(比如:不用考虑重复提交之类的问题了)。  

71. 另外我加上opener=null这句,是根据我的理解加上去的,好象去掉也照样可以实现同样的效果。这里如果将top换parent也同样可以使用。但是如果换window.close()那提示框又回来了。以上都是在IE6.0以上版本实现的效果,别的浏览器没试验过。  

72.  

73. 小注:我在查看文章的时候,有人这样说,在需要关闭的窗口<body>里加上onblur="self.close()",然后在用window.close()方法关闭当前窗口也不会出现提示,但是我在我机器上怎么试都不行!不得而知为什么!  

74. 另外又有人说,如果是用open()方法打开的子窗口里,直接用windown.close()或top.close()都可以直接关闭窗口,我试了,好象这样的情况下,在body加上onblur="self.close()"后,的确是可以的,但是不加的没测试。实现我的效果了。做个简单的记录。  

html框架集 js刷新页面方法大全

分类: Web2012-04-26 08:01 502人阅读 评论(0) 收藏 举报

html框架buttonjavascript.netaction

一、先来看一个简单的例子:

下面以三个页面分别命名为frame.html、top.html、bottom.html为例来具体说明如何做。

frame.html 由上(top.html)下(bottom.html)两个页面组成,代码如下:

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> frame </TITLE>

</HEAD>

<frameset rows="50%,50%">

<frame name=top src="top.html">

<frame name=bottom src="bottom.html">

</frameset>

</HTML>

现在假设top.html (即上面的页面) 有七个button来实现对bottom.html (即下面的页面) 的刷新,可以用以下七种语句,哪个好用自己看着办了。

top.html 页面的代码如下:

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> top.html </TITLE>

</HEAD>

<BODY>

<input type=button value="刷新1" onclick="window.parent.frames[1].location.reload()"><br>

<input type=button value="刷新2" onclick="window.parent.frames.bottom.location.reload()"><br>

<input type=button value="刷新3" onclick="window.parent.frames['bottom'].location.reload()"><br>

<input type=button value="刷新4" onclick="window.parent.frames.item(1).location.reload()"><br>

<input type=button value="刷新5" onclick="window.parent.frames.item('bottom').location.reload()"><br>

<input type=button value="刷新6" onclick="window.parent.bottom.location.reload()"><br>

<input type=button value="刷新7" onclick="window.parent['bottom'].location.reload()"><br>

</BODY>

</HTML>

下面是bottom.html页面源代码,为了证明下方页面的确被刷新了,在装载完页面弹出一个对话框。

复制代码 代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD>

<TITLE> bottom.html </TITLE>

</HEAD>

<BODY onload="alert('我被加载了!')">

<h1>This is the content in bottom.html.</h1>

</BODY>

</HTML>

解释一下:

复制代码 代码如下:

1.window指代的是当前页面,例如对于此例它指的是top.html页面。

2.parent指的是当前页面的父页面,也就是包含它的框架页面。例如对于此例它指的是framedemo.html。

3.frames是window对象,是一个数组。代表着该框架内所有子页面。

4.item是方法。返回数组里面的元素。

5.如果子页面也是个框架页面,里面还是其它的子页面,那么上面的有些方法可能不行。

附:

Javascript刷新页面的几种方法:

1 history.go(0)

2 location.reload()

3 location=location

4 location.assign(location)

5 document.execCommand('Refresh')

6 window.navigate(location)

7 location.replace(location)

8 document.URL=location.href

二、自动刷新页面

1.页面自动刷新:把如下代码加入<head>区域中

<meta http-equiv="refresh" content="20">

其中20指每隔20秒刷新一次页面.

2.页面自动跳转:把如下代码加入<head>区域中

<meta http-equiv="refresh" content="20;url=http://www.jb51.net">

其中20指隔20秒后跳转到http://www.jb51.net页面

3.页面自动刷新js版

 

<script language="JavaScript">

function myrefresh()

{

window.location.reload();

}

setTimeout('myrefresh()',1000); //指定1秒刷新一次

</script>

  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

三、java在写Servler,Action等程序时,要操作返回页面的话(如谈出了窗口,操作完成以后,关闭当前页面,刷新父页面)

复制代码 代码如下:

1 PrintWriter out = response.getWriter();

2 out.write("<script type=\"text/javascript\">");

3 ////子窗口刷新父窗口

4 out.write("self.opener.location.reload();");

5 //关闭窗口

6 out.write("window.opener=null;");

7 out.write("window.close();");

8 out.write("</script>");

四、JS刷新框架的脚本语句

1.如何刷新包含该框架的页面用

复制代码 代码如下:

<script language=JavaScript>

parent.location.reload();

</script>

2.子窗口刷新父窗口

复制代码 代码如下:

<script language=JavaScript>

self.opener.location.reload();

</script>

3.如何刷新另一个框架的页面用 (上面的实例以说明了)

复制代码 代码如下:

语句1. window.parent.frames[1].location.reload();

语句2. window.parent.frames.bottom.location.reload();

语句3. window.parent.frames["bottom"].location.reload();

语句4. window.parent.frames.item(1).location.reload();

语句5. window.parent.frames.item('bottom').location.reload();

语句6. window.parent.bottom.location.reload();

语句7. window.parent['bottom'].location.reload();

4.如果想关闭窗口时刷新或者想开窗时刷新的话,在<body>中调用以下语句即可。

<body onload="opener.location.reload()">

开窗时刷新

<body onUnload="opener.location.reload()">

关闭时刷新

复制代码 代码如下:

<script language="javascript">

window.opener.document.location.reload()

</script>

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: