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

这篇文章给大家分享HTML页面点击按钮关闭页面的几种方式,实现思路非常简单,有不带任何方式的关闭窗口,提示之后关闭页面,点击关闭本页面并跳转到其他页面等等,每种方式结合实例代码给大家介绍的非常详细,需要的朋友参考下吧。

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

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

1

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

二、提示之后关闭页面

1

2

3

4

5

6

7

8

9

10

11

12

<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()" />

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<!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="https://www.weidianyuedu.com">点击跳转到微点阅读</a>    

<script>

    function myFunction() {

        return "我在这写点东西...";

    }

</script>

</body>

</html>

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

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<!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="https://www.weidianyuedu.com">点击调转到微点阅读网</a>

<script>

    window.onbeforeunload = function(event) {

        event.returnValue = "我在这写点东西...";

    };

</script>

</body>

</html>

到此这篇关于HTML页面点击按钮关闭页面的多种方式的文章就介绍到这了,希望可以帮到你。

转载自:https://www.weidianyuedu.com

猜你喜欢

转载自blog.csdn.net/hdxx2022/article/details/128148730
今日推荐