所以我想为一个项目制作一个页面,当你点击窗口上的“确定”确认时,它会将你带到一个登录论坛(即有效)。但是,如果你点击取消,登录论坛不会加载,它会把你带到别的地方。我将如何做到这一点?我是Javascript新手,所以我很抱歉不清楚我的问题。这里是我的代码:取消激活上一个命令
// variable information
var person = {
name: " Alex, ",
age: " 27 years old, ",
height: "183cm, ",
born: " born January 12th 1996, ",
weight: " 130 Lb "
};
window.alert("Information. Click ok to continue");
//confirm box, determines if forum loads or not... or thats the plan.
{
if (confirm("All information in this is to remain private. Do not share any information given. Please accept these conditions.") == true) {
alert("Now loading file information. Please wait a moment...");
//number of attempts
var attempt = 3;
// executes on click below
function validate() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
if (username == "Correct" && password == "1141") {
alert("Login successfully");
var x = person.age;
var y = person.name;
var z = person.born;
var a = person.height;
var b = person.weight;
document.write(y);
document.write(x);
document.write(z);
document.write(a);
document.write(b);
return false;
} else {
// chances available.
alert("incorrect login. You have " + attempt + " attempt;");
// Disables after 2 attempts
if (attempt == 0) {
document.getElementById("username").disabled = true;
document.getElementById("password").disabled = true;
document.getElementById("submit").disabled = true;
return false;
}
}
}
}
// if false
else
alert("Could not load. Error 707.");
}
@import url(http://fonts.googleapis.com/css?family=Raleway);
h2 {
background-color: #FEFFED;
padding: 30px 35px;
margin: -10px -50px;
text-align: center;
border-radius: 10px 10px 0 0;
}
hr {
margin: 10px -50px;
border: 0;
border-top: 1px solid #ccc;
margin-bottom: 40px;
}
div.container {
width: 900px;
height: 610px;
margin: 35px auto;
font-family: 'Raleway', sans-serif;
}
div.main {
width: 300px;
padding: 10px 50px 25px;
border: 2px solid gray;
border-radius: 10px;
font-family: raleway;
float: left;
margin-top: 50px;
}
input[type=text],
input[type=password] {
width: 100%;
height: 40px;
padding: 5px;
margin-bottom: 25px;
margin-top: 5px;
border: 2px solid #ccc;
color: #4f4f4f;
font-size: 16px;
border-radius: 5px;
}
label {
color: #464646;
text-shadow: 0 1px 0 #fff;
font-size: 14px;
font-weight: bold;
}
center {
font-size: 32px;
}
.note {
color: red;
}
.valid {
color: green;
}
.back {
text-decoration: none;
border: 1px solid rgb(0, 143, 255);
background-color: rgb(0, 214, 255);
padding: 3px 20px;
border-radius: 2px;
color: black;
}
input[type=button] {
font-size: 16px;
background: linear-gradient(#ffbc00 5%, #ffdd7f 100%);
border: 1px solid #e5a900;
color: #4E4D4B;
font-weight: bold;
cursor: pointer;
width: 100%;
border-radius: 5px;
padding: 10px 0;
outline: none;
}
input[type=button]:hover {
background: linear-gradient(#ffdd7f 5%, #ffbc00 100%);
}
<!DOCTYPE html>
<html>
<head>
<title>Javascript Login Form Validation</title>
<!-- Include CSS File Here -->
<link rel="stylesheet" href="css/style.css" />
<!-- Include JS File Here -->
<script src="js/login.js"></script>
</head>
<body>
<div class="container">
<div class="main">
<h2>Javascript Login Form Validation</h2>
<form id="form_id" method="post" name="myform">
<label>User Name :</label> <input type="text" name="username" id="username" />
<label>Password :</label> <input type="password" name="password" id="password" /> <input type="button" value="Login" id="submit" onclick="validate()" /> </form>
enter code here
</body>
</html>
在你的'如果(确认())'测试,你想用'window.location'更改URL。这里是一个例子https://codepen.io/mcoker/pen/oWGYwz –