用户离开页面时的操作

Question

In my HTML code, I want to show only to link buttons to either register or login and then, if the user is not interested in either and decides to close the page, I want to ask him whether he would be interested in viewing the listings (via maybe a dialogue box) and then if he clicks "yes", to go to the listings page. 在我的HTML代码中，我只想显示用于注册或登录的链接按钮，然后，如果用户对两者都不感兴趣并决定关闭该页面，我想问他是否对查看列表感兴趣。（通过对话框），然后如果他单击“是”，则转到列表页面。

So, I decided to make the listings link button invisible at the beginning and make it visible in the function myFunction, which should be invoked when the page closes or refreshes (another problem) via the onbeforeunload . 因此，我决定在开始时使清单链接按钮不可见，并使其在函数myFunction中可见，当页面通过onbeforeunload关闭或刷新（另一个问题）时应调用该函数。

The problem that even though this works, the dialogue box that appears has this standard line that says "the page is asking you to confirm that you want to leave. data entered might not be safe." 即使这样行之有效的问题，出现的对话框中的标准行也写着“页面正在要求您确认要离开。输入的数据可能并不安全。” instead of what I type after return. 而不是我在返回后输入的内容。 For some, reason, I'm not allowed to post questions yet, so please bear with me. 出于某种原因，我还不允许发布问题，请耐心等待。 This seems to be the default content. 这似乎是默认内容。 How do this? 怎么办 Also, is there a better way? 另外，还有更好的方法吗？

Here is my HTML code: 这是我的HTML代码：

`    <!DOCTYPE HTML>
<html>
<head>

        <link rel="stylesheet" type="text/css" href="CSS/a.css">

</head>


<body onbeforeunload="return myFunction()">
        <h3>Click the appropriate button</h3>
        <div>
                <a href="Reg.html"><button style="background-color:red; color:white;">Register</button></a> <br><br>
                <a href="Login.html"><button style="background-color:red; color:white;">Login</button></a> <br><br>
                <a href="Listings.html"><button class="hidden" id='marketing' style="background-color:green; color:white;">View Listings</button>
        </div>
<script>
        function myFunction() {
                document.getElementById('marketing').style.display='block';
                return "Do you want to view listings without registering?";

}
</script>

</body>
</html>`

And my CSS code: 还有我的CSS代码：

input[type=text], select {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
}

input[type=submit] {
    width: 100%;
    background-color: #4CAF50;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

input[type=submit]:hover {
    background-color: #45a049;
}

div {
    border-radius: 5px;
    background-color: #f2f2f2;
    padding: 20px;
}

.hidden{
        display:none;
}





  [1]: https://i.stack.imgur.com/Q1a9W.png

Answer 1

I forgot what to write, i just ripped it here and there from w3schools 我忘了写什么，我只是从w3schools那里撕了

Just enjoy 享受就好

 function myFunction() { var txt; var r = confirm("Press a button!\\nEither OK or Cancel.\\nThe button you pressed will be displayed in the result window."); if (r == true) { window.location.href = "https://stackoverflow.com/" } else { txt = "You pressed Cancel!"; } document.getElementById("demo").innerHTML = txt; }

 <h3>Click the appropriate button</h3> <div> <a href="Reg.html"><button style="background-color:red; color:white;">Register</button></a> <br><br> <a href="Login.html"><button style="background-color:red; color:white;">Login</button></a> <br><br> <button id='marketing' onclick="myFunction()" style="background-color:green; color:white;">View Listings</button> </div> <p id="demo"> </p>

用户离开页面时的操作

问题描述

1 个解决方案

解决方案1
0 2017-11-12 12:21:08

用户离开页面时的操作

问题描述

1 个解决方案

解决方案1 0 2017-11-12 12:21:08

解决方案1
0 2017-11-12 12:21:08