2017-05-04 84 views
0

所以我想为一个项目制作一个页面,当你点击窗口上的“确定”确认时,它会将你带到一个登录论坛(即有效)。但是,如果你点击取消,登录论坛不会加载,它会把你带到别的地方。我将如何做到这一点?我是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>

+0

在你的'如果(确认())'测试,你想用'window.location'更改URL。这里是一个例子https://codepen.io/mcoker/pen/oWGYwz –

回答

0

我相信这是你在找什么。

if (confirm("All information in this is to remain private. Do not share any information given. Please accept these conditions.") == true) { 
    //... 
} else { 
    window.location.href = "http://stackoverflow.com"; 
} 
+0

我是js的新手,但是我在某处读到这个窗口可以被忽略,并且只能是location.href?我错了还是仅仅不推荐 –

+0

你是对的。你可以离开窗户。但我会建议你保留它。可以说你有一个变量叫做位置。所以,当你尝试location.href它可能不会工作,因为位置也是一个局部变量。 – noyanc