有人可以告诉我成功注册新用户后,为什么我的成功消息没有显示在HTML表单上吗?我从数据库中看到该用户已注册,但是,该页面没有重新加载“成功消息”,而是重新加载,并且未显示任何消息。这是正在使用的HTML和JavaScript代码。而且,它还会引发此错误,我不知道如何解决它。“未捕获的ReferenceError:未定义$” 。 谢谢。
$(document).ready(function() {
});
function newUser() {
// object
var user = new Object();
var error;
// user inputs
user.fname = $('#fname').val();
user.lname = $('#lname').val();
user.username = $('#username').val();
user.usertype = $('#usertype').val();
user.email = $('#email').val();
user.phoneno = $('#phoneno').val();
user.pswd1 = $('#pswd1').val();
user.pswd2 = $('#pswd2').val();
error = true;
if (error == true) {
$
.ajax({
url: 'AddUser',
type: 'POST',
dataType: 'json',
data: JSON.stringify(user),
contentType: 'application/json',
mimeType: 'application/json',
success: function(data) {
if (data.message == "Registered") {
alert("Registered!");
$("#message").empty();
$("#message").append(
$('<div class="alert alert-success alert-dismissible" role="alert">' +
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">' +
'<span aria-hidden="true">×</span></button>' +
'<i class="fa fa-check-circle" style="text-align: center">' +
data.message +
'</i></div>'));
$('html,body').scrollTop(0);
} else {
$("#message").empty();
$("#message").append(
$('<div class="alert alert-danger alert-dismissible" role="alert">' +
'<button type="button" class="close" data-dismiss="alert" aria-label="Close">' +
'<span aria-hidden="true">×</span></button>' +
'<i class="fa fa-times-circle" style="text-align: center">' +
data.message +
'</i></div>'));
$('html,body').scrollTop(0);
}
},
error: function(data, status, err) {
alert("error: " + data + " status: " + status + " er:" + err);
}
});
}
}
<!DOCTYPE HTML>
<html>
<head>
<title>Registration Page</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Pooled Responsive web template, Bootstrap Web Templates, Flat Web Templates, Android Compatible web template,
Smartphone Compatible web template, free webdesigns for Nokia, Samsung, LG, SonyEricsson, Motorola web design" />
<script type="application/x-javascript">
addEventListener("load", function() {
setTimeout(hideURLbar, 0);
}, false);
function hideURLbar() {
window.scrollTo(0, 1);
}
</script>
<!-- Bootstrap Core CSS -->
<link href="web/css/bootstrap.min.css" rel='stylesheet' type='text/css' />
<!-- Custom CSS -->
<link href="web/css/style.css" rel='stylesheet' type='text/css' />
<link rel="stylesheet" href="css/morris.css" type="text/css" />
<!-- Graph CSS -->
<link href="web/css/font-awesome.css" rel="stylesheet">
<link rel="stylesheet" href="web/css/jquery-ui.css">
<!-- jQuery -->
<script src="js/jquery-2.1.4.min.js"></script>
<!-- //jQuery -->
<link href='//fonts.googleapis.com/css?family=Roboto:700,500,300,100italic,100,400' rel='stylesheet' type='text/css' />
<link href='//fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
<!-- lined-icons -->
<link rel="stylesheet" href="web/css/icon-font.min.css" type='text/css' />
<!-- //lined-icons -->
<!-- These are my own scripts -->
<script src="js/registration.js"></script>
</head>
<body>
<div id="message" style="width: 20vw;margin-left: 24vw;"></div>
<div class="main-wthree">
<div class="container">
<div class="sin-w3-agile">
<h2>New User Registration</h2>
<form action="#" method="post">
<div class="username">
<span class="username">First name:</span> <input type="text" name="fname" class="name" id="fname" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="username">
<span class="username">Last name:</span> <input type="text" name="lname" class="name" id="lname" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="username">
<span class="username">Username:</span> <input type="text" name="name" class="name" id="username" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="username">
<span class="username">User type:</span>
<select name="usertype" id="usertype" required="">
<option></option>
<option value=1>Admin</option>
<option value=2>Normal</option>
</select>
<div class="clearfix"></div>
<br>
</div>
<div class="username">
<span class="username">Email:</span> <input type="text" name="email" class="name" id="email" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="username">
<span class="username">Phone number:</span> <input type="tel" name="phoneno" class="name" id="phoneno" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="password-agileits">
<span class="username">Password:</span> <input type="password" name="password" class="password" id="pswd1" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="password-agileits">
<span class="username">Confirm Password:</span> <input type="password" name="password" id="pswd2" class="password" placeholder="" required="">
<div class="clearfix"></div>
</div>
<div class="login-w3">
<input type="submit" class="login" id="registerUser" onclick="newUser()" value="Register">
</div>
<div class="clearfix"></div>
</form>
</div>
</div>
</div>
</body>
</html>