我怎麼能去到預覽頁面,從註冊頁面並返回從預覽頁面註冊頁面進行修改
我要註冊在MySql數據庫的基本信息。但是在註冊數據之前,我希望用戶預覽值,如果他符合他所返回的值,則返回並修改其信息。我想用Ajax來做,而不需要重新加載頁面。
utils.js
function createRequest() {
try {
request = new XMLHttpRequest();
} catch (tryMS) {
try {
request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (otherMS) {
try {
request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (failed) {
request = null;
}
}
}
return request;
}
function getActivatedObject(e) {
var obj;
if (!e) {
// early version of IE
obj = window.event.srcElement;
} else if (e.srcElement) {
// IE 7 or later
obj = e.srcElement;
} else {
// DOM Level 2 browser
obj = e.target;
}
return obj;
}
function addEventHandler(obj, eventName, handler) {
if (document.attachEvent) {
obj.attachEvent("on" + eventName, handler);
} else if (document.addEventListener) {
obj.addEventListener(eventName, handler, false);
}
}
Validation.js
window.onload = initPage;
function initPage() {
document.getElementById("register").onclick = registerUser;
}
function registerUser() {
document.getElementById("register").value = "Processing...";
registerRequest = createRequest();
if (registerRequest == null) {
alert("Unable to create request.");
} else {
var url = "register-feedback.php";
var requestData = "username=" +
escape(document.getElementById("username").value) + "&firstname=" +
escape(document.getElementById("firstname").value) + "&lastname=" +
escape(document.getElementById("lastname").value) + "&email=" +
escape(document.getElementById("email").value) + "&tastes=" +
escape(document.getElementById("tastes").value);
registerRequest.onreadystatechange = registrationProcessed;
registerRequest.open("POST", url, true);
registerRequest.setRequestHeader("Content-Type",
"application/x-www-form-urlencoded");
registerRequest.send(requestData);
}
}
function registrationProcessed() {
if (registerRequest.readyState == 4) {
if (registerRequest.status == 200) {
document.getElementById('wrapper').innerHTML =
registerRequest.responseText;
}
}
}
registration.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mike's Movies</title>
<link rel="stylesheet" href="css/movies.css" />
<script src="scripts/utils.js" type="text/javascript"></script>
<script src="scripts/validation.js" type="text/javascript"></script>
</head>
<body>
<div id="wrapper">
<h1>Please register to access reviews:</h1>
<form action="register.php" method="POST">
<ul>
<li><label for="username">Username:</label><input id="username" type="text" name="username" /></li>
<li><label for="firstname">First Name:</label><input id="firstname" type="text" name="firstname" /></li>
<li><label for="lastname">Last Name:</label><input id="lastname" type="text" name="lastname" /></li>
<li><label for="email">Email:</label><input id="email" type="text" name="email" /></li>
<li><label for="tastes">Message:</label><textarea name="tastes" cols="60" rows="2" id="tastes"></textarea></li>
<li><label for="register"></label><input id="register" type="button" value="Register" name="register" /></li>
</ul>
</form>
</div>
</body>
</html>
register-feedback.php
<?php sleep(1);
echo "<h1>Welcome to Mike's!</h1>";
echo "<p>Here's what you entered, " . $_REQUEST['firstname'] . ":</p>";
echo "<p>Username: " . $_REQUEST['username'] . "</p>";
echo "<p>Name: " . $_REQUEST['firstname'] . " " . $_REQUEST['lastname'] . "</p>";
echo "<p>Email: " . $_REQUEST['email'] . "</p>";
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mike's Movies</title>
<link rel="stylesheet" href="css/movies.css" />
<script src="scripts/utils.js" type="text/javascript"></script>
</head>
<body>
<input id="cancelm" type="button" value="back" name="cancelm" onclic=cancelUser()/>
<input id="sendm" type="button" value="send" name="sendm" />
<div id="coverBar">
</div>
</body>
</html>
你能張貼你到目前爲止試過嗎? –
好的,謝謝! – Jona
看看[jQuery Wizard](http://www.jquery-steps.com/),它可以幫助你實現你需要的東西 –