-1
好吧,我有問題令我困惑。我有一個我爲一個項目編寫的註冊頁面,並且每次輸入它應該存儲在cookie中的信息。我第一次看後,看到了欄中的信息,但它不會傳遞到登錄頁面。Javascript錯誤?頁面重置
下面是HTML:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<!--
Project (Register.html)
Author: Michael R. Mastro II
Date: 06 Jun 2015
-->
<title>Registration Page</title>
<script type="text/javascript">
/* <![CDATA[ */
/* ]]> */
</script>
</head>
<body style="background-color:red">
<form action = "" id="aboutForm" method="get"
enctype="application/x-www-form-urlencoded"
onsubmit="confirmSubmit();"
onreset="return confirmReset();">
<h2 style="text-align:center; color:white">Pizzeria Registration Page</h2>
<p style="color:white">User Name: <input type="text" name="userName" id="userName" size="50" value="Enter Username" onfocus="if(this.value == 'Enter Username') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter Username';}" /></p>
<p style="color:white">Street Address: <input type="text" name="sAdd" id="sAdd" size="50" value="Enter Street Address" onfocus="if(this.value == 'Enter Street Address') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter Street Address';}" /></p>
<p style="color:white">City, State, Zip: <input type="text" name="city" id="city" size="30" value="Enter City" onfocus="if(this.value == 'Enter City') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter City';}" /><br /><br /> <input type="text" name="state" id="state" size="10" maxlength="3" value="Enter State" onfocus="if(this.value == 'Enter State') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter State';}" /> <input type="text" name="zipCode" id="zipCode" size="20" maxlength="10" value="Enter Zip Code" onfocus="if(this.value == 'Enter Zip Code') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter Zip Code';}" /><br /><br /></p>
<p style="color:white">Email Address: <input type="text" name="emailAddress" id="emailAddress" size="50" value="Enter Email Address" onfocus="if(this.value == 'Enter Email Address') {this.value = '';}" onblur="if(this.value == '') {this.value = 'Enter Email Address';}" /></p>
<p style="color:white">Password: <input type="password" name="password" id="password" size="50" /><br /><br />
Confirm Password: <input type="password" name="password_confirm" id="password_confirm" size="50" onblur="confirmPassword();" /><br /><br /></p>
<p>
<input type="submit" value="Submit" /> <input type="reset" value="Cancel" />
</p>
</form>
</body>
這裏是JavaScript:
function registerForm() {
var userName = document.getElementById('userName').value;
var sAdd = document.getElementById('sAdd').value;
var city = document.getElementById('city').value;
var state = document.getElementById('state').value;
var zip = document.getElementById('zipCode').value;
var emailAddress = document.getElementById('emailAddress').value;
var password = document.getElementById('password').value;
var regDate = new Date();
regDate.setFullYear(regDate.getFullYear() + 1);
document.cookie = "username=" + encodeURIComponent(userName) + "; expires=" + regDate.toUTCString();
document.cookie = "street=" + encodeURIComponent(sAdd) + "; expires=" + regDate.toUTCString();
document.cookie = "city=" + encodeURIComponent(city) + "; expires=" + regDate.toUTCString();
document.cookie = "state=" + encodeURIComponent(state) + "; expires=" + regDate.toUTCString();
document.cookie = "zip=" + encodeURIComponent(zip) + "; expires=" + regDate.toUTCString();
document.cookie = "emailAddress=" + encodeURIComponent(emailAddress) + "; expires=" + regDate.toUTCString();
document.cookie = "password=" + encodeURIComponent(password) + "; expires=" + regDate.toUTCString();
window.alert("Thank you for registering!");
close.this();
}
function confirmSubmit(){
//This function will validate that all the fields are filled in. It will also
//check that the email address is a valid form of email address. If a box is not
//valid, then it sets the focus on that field.
//This will verify the username field has been filled out
if(document.getElementById('userName').value == "Enter Username"
|| document.getElementById('userName').value == ""){
alert("You must enter a username");
document.getElementById('userName').focus();
return false;
} // end userName if statement
//This will verify that the username is not already in use
if(document.cookie.length == 0){
return false;
}
else{
var savedData = decodeURIComponent(document.cookie);
var dataArray = savedData.split("; ");
var storedName;
for (var i = 0; i < dataArray.length; ++i) {
if (dataArray[i].substring(0,dataArray[i].indexOf("="))== "username") {
storedName = dataArray[i].substring(dataArray[i].indexOf("=") + 1,dataArray[i].length);
}
}
if(document.getElementById('userName').value == storedName){
alert("Username already being used, please choose another Username");
}
return false;
}
//This will verify the street address field has been filled out
if(document.getElementById('sAdd').value == "Enter Street Address"
|| document.getElementById('sAdd').value == ""){
alert("You must enter a street address");
document.getElementById('sAdd').focus();
return false;
} // end sAdd if statement
//This will verify the city field has been filled out
if(document.getElementById('city').value == "Enter City"
|| document.getElementById('city').value == ""){
alert("You must enter a city");
document.getElementById('city').focus();
return false;
} // end city if statement
//This will verify the state field has been filled out
if(document.getElementById('state').value == "Enter State"
|| document.getElementById('state').value == ""){
alert("You must enter a state");
document.getElementById('state').focus();
return false;
} // end state if statement
//This will verify the zip code field has been filled out
if(document.getElementById('zipCode').value == "Enter Zip Code"
|| document.getElementById('zipCode').value == ""){
alert("You must enter a zip code");
document.getElementById('zipCode').focus();
return false;
} // end zipCode if statement
//This will verify the email Address field has been filled out
if(document.getElementById('emailAddress').value == "Enter Email Address"
|| document.getElementById('emailAddress').value == ""){
alert("You must enter a email address");
document.getElementById('emailAddress').focus();
return false;
} // end emailAddress if statement
var emailPattern = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
var email = document.getElementById('emailAddress').value;
if(!email.match(emailPattern)){
alert("You must enter a valid email address");
document.getElementById('emailAddress').focus();
return false;
}
//This will verify the password field has been filled out
if(document.getElementById('password').value == ""){
alert("You must enter a password");
document.getElementById('password').focus();
return false;
} // end password if statement
var submitForm = window.confirm("Are you sure you want to submit the form?");
if(submitForm == true)
return registerForm();
else{
return false;
}
} // end confirmSubmit function
function confirmReset(){
var resetForm = window.confirm("Are you sure you want to reset the form?");
if(resetForm == true)
return true;
return false;
} // end confirmReset function
function confirmPassword(){
//Function should check to see if the two passwords entered are the same..
//if they are not, pop up an alert and set the focus back to password
var password = document.getElementById('password').value;
var password_confirm = document.getElementById('password_confirm').value;
if(password != password_confirm){
alert("Passwords do not match.");
document.getElementById('password').value = "";
document.getElementById('password_confirm').value = "";
document.getElementById('password').focus();
} // end if statement
} // end confirmPassword function
它應該返回到登錄頁面,但它不會後腦勺有。有什麼想法嗎?
爲什麼你不使用Jquery解決方案?對於JavaScript中的cookie,你需要做額外的工作。如果您對Jquery解決方案感興趣,那麼請通過添加jQUERY標籤,讓我知道並編輯您的問題 – Alex
也許小提琴幫助我們協助您? – vpzomtrrfrt
@MikeMastro檢查我的答案。 javascript解決方案 – Alex