关闭浏览器当前页面

最新推荐文章于 2024-07-23 18:27:01 发布

Bright2017

最新推荐文章于 2024-07-23 18:27:01 发布

阅读量2.6k

点赞数 1

分类专栏：网页中用到过的效果文章标签：关闭浏览器当前页面

网页中用到过的效果专栏收录该内容

138 篇文章 0 订阅

订阅专栏

在一位大牛博客里看到的，火狐浏览器也可以有效，唯一的问题时火狐浏览器当前页面会变成空白页面而窗口不会关闭，绝大多数浏览器都兼容。下面是我写的一个小例子：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>关闭浏览器当前页面</title>
		<style>
			#demo{
				width: 210px;
			    height: 50px;
			    margin: 200px auto;
			}
			#demo>input{
				width: 100%;
				height: 100%;
				border-radius: 4px;
				outline: none;
				border: 1px solid #999;
				color: white;
				background: orange;
				font-size: 18px;
				font-family: cursive;
				cursor: pointer;
			}
		</style>
	</head>
	<body>
		<div id="demo">
			<input type="button" value="关闭" class="btn"/>
		</div>
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<script type="text/javascript">
			$(".btn").click(function(){
				CloseWebPage();
			});
			function CloseWebPage(){
			 if (navigator.userAgent.indexOf("MSIE") > 0) {
			  if (navigator.userAgent.indexOf("MSIE 6.0") > 0) {
			   window.opener = null;
			   window.close();
			  } else {
			   window.open('', '_top');
			   window.top.close();
			  }
			 }
			 else if (navigator.userAgent.indexOf("Firefox") > 0) {
			  window.location.href = 'about:blank ';
			 } else {
			  window.opener = null;
			  window.open('', '_self', '');
			  window.close();
			 }
			}
		</script>
	</body>
</html>