js实现当前页面关闭功能

页面实现

<div>
	<input type="button" value="关闭当前页" class="close" onclick="closeWin()">
div>

js的关闭方法

function closeWin(){
	//有关闭确认
	//if(confirm("您确定要关闭本页吗？")){
		window.opener=null;
		window.open('','_self');
		window.close();
	//}
}

关闭按钮的样式

.close{
	background-color: #f44336;
	border: none;
	color: white;
	padding: 15px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	cursor: pointer;
	position:fixed;
	top:10px;
	right:5px;
}

//鼠标悬停时出现的阴影
.close:hover {
	box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19);
}

最终实现效果：

在触摸屏并全屏显示的情况下，使用这个方式来关闭当前打开的页面是很好的方式。

---

2019.05.10 补充

• 发现这个关闭的方法不是任何时候都有效的，只能在关闭子窗口或者点击链接打开的新窗口才有效。