HTML页面点击按钮关闭页面的多种方式


Posted in HTML / CSS onDecember 24, 2022

HTML页面点击按钮关闭页面的几种方式

一、不带任何方式的关闭窗口

<input type="button" name="close" value="关闭" onclick="window.close();" />

二、提示之后关闭页面

<script>
function custom_close(){
    if(confirm("您确定要关闭本页吗?")){
        window.opener=null;
        window.open('','_self');
        window.close();
    }
    else{
    }
}
</script>
<input id="btnClose" type="button" value="关闭本页" onClick="custom_close()" />

三、点击关闭本页面并跳转到其他页面

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>html中</title>
</head>
<body onbeforeunload="return myFunction()">
<p>该实例演示了如何向 body 元素添加 "onbeforeunload" 事件。</p>
<p>关闭当前窗口,点击以下链接触发 onbeforeunload 事件。</p>
<a href="http://www.3water.com">点击跳转到三水点靠木</a>     
<script>
    function myFunction() {
        return "我在这写点东西...";
    }
</script>
</body>
</html>

四、将 三 中的方法放到js中

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript 中</title>
</head>
<body>
    <p>该实例演示了如何使用 HTML DOM 向 body 元素添加 "onbeforeunload" 事件。</p>
    <p>关闭当前窗口,按下 F5 或点击以下链接触发 onbeforeunload 事件。</p>
    <a href="http://www.3water.com">点击调转到三水点靠木</a>
<script>
    window.onbeforeunload = function(event) {
        event.returnValue = "我在这写点东西...";
    };
</script>
</body>
</html>

到此这篇关于HTML页面点击按钮关闭页面的多种方式的文章就介绍到这了,更多相关html点击按钮关闭页面内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!

 
HTML / CSS 相关文章推荐
CSS3 优势以及网页设计师如何使用CSS3技术
Jul 29 HTML / CSS
纯CSS3制作的简洁蓝白风格的登录模板(非IE效果更好)
Aug 11 HTML / CSS
css3 中的新特性加强记忆详解
Apr 16 HTML / CSS
css3加js做一个简单的3D行星运转效果实例代码
Jan 18 HTML / CSS
教你如何一步一步用Canvas写一个贪吃蛇
Oct 22 HTML / CSS
基于HTML5 audio元素播放声音jQuery小插件
May 11 HTML / CSS
Html5游戏开发之乒乓Ping Pong游戏示例(一)
Jan 21 HTML / CSS
html5中canvas图表实现柱状图的示例
Nov 13 HTML / CSS
AmazeUI 平滑滚动效果的示例代码
Aug 20 HTML / CSS
html粘性页脚的具体使用
Jan 18 HTML / CSS
纯CSS打字动画的实现示例
Aug 05 HTML / CSS
Li list-style-image 图片垂直居中实现方法
May 21 HTML / CSS
html用代码制作虚线框怎么做? dw制作虚线圆圈的技巧
Dec 24 #HTML / CSS
CSS使用SVG实现动态分布的圆环发散路径动画
Dec 24 #HTML / CSS
CSS中理解层叠性及权重如何分配
Dec 24 #HTML / CSS
CSS 鼠标点击拖拽效果的实现代码
Dec 24 #HTML / CSS
详解CSS3浏览器兼容
Dec 24 #HTML / CSS
HTML5页面打开微信小程序功能实现
Sep 23 #HTML / CSS
CSS元素定位之通过元素的标签或者元素的id、class属性定位详解
Sep 23 #HTML / CSS
You might like
关于php curl获取301或302转向的网址问题的解决方法
2011/06/02 PHP
php实现的漂亮分页方法
2014/04/17 PHP
php 中htmlentities导致中文无法查询问题
2018/09/10 PHP
Jquery优化效率 提升性能解决方案
2010/09/06 Javascript
Js日期选择器并自动加入到输入框中示例代码
2013/08/02 Javascript
JavaScript实现同步于本地时间的动态时间显示方法
2015/02/02 Javascript
Javascript实现可旋转的圆圈实例代码
2015/08/04 Javascript
jquery获取img的src值的简单实例
2016/05/17 Javascript
js仿iphone秒表功能 计算平均数
2017/01/11 Javascript
js canvas实现放大镜查看图片功能
2017/06/08 Javascript
JavaScript创建对象的七种方式(推荐)
2017/06/26 Javascript
Angular js 实现添加用户、修改密码、敏感字、下拉菜单的综合操作方法
2017/10/24 Javascript
详解微信小程序中var、let、const用法与区别
2020/01/11 Javascript
在vue中通过render函数给子组件设置ref操作
2020/11/17 Vue.js
python的socket编程入门
2018/01/29 Python
Python3使用TCP编写一个简易的文件下载器功能
2019/05/08 Python
Python3+OpenCV2实现图像的几何变换(平移、镜像、缩放、旋转、仿射)
2019/05/13 Python
Python的Tkinter点击按钮触发事件的例子
2019/07/19 Python
Python操作远程服务器 paramiko模块详细介绍
2019/08/07 Python
Series和DataFrame使用简单入门
2019/11/13 Python
解决pytorch DataLoader num_workers出现的问题
2020/01/14 Python
Python利用逻辑回归模型解决MNIST手写数字识别问题详解
2020/01/14 Python
Python容器类型公共方法总结
2020/08/19 Python
Python猫眼电影最近上映的电影票房信息
2020/09/18 Python
GNC健安喜美国官网:美国第一营养品牌
2016/07/22 全球购物
床上用品全球在线购物:BeddingInn
2016/12/18 全球购物
龟牌英国商店:Turtle Wax Brand Store UK
2019/07/02 全球购物
美国和加拿大计算机和电子产品购物网站:TigerDirect.com
2019/09/13 全球购物
希腊品牌鞋类销售网站:epapoutsia.gr
2020/03/18 全球购物
宿舍卫生检讨书
2014/01/16 职场文书
中国梦我的梦演讲稿
2014/04/23 职场文书
机关搬迁方案
2014/05/18 职场文书
教师暑期培训感言
2014/08/15 职场文书
房地产端午节活动方案
2014/08/24 职场文书
离婚协议书该怎么写
2014/10/04 职场文书
暑期社会实践新闻稿
2015/07/17 职场文书