所以我有这样的表单设置，看起来完全像这样：http://i.imgur.com/z8zI2aJ.png我要做的是在用户停止输入后更改表单字段的类，如下所示检查我的数据库中是否存在用户名/电子邮件。这应该在不重新加载页面的情况下完成。我怎样才能做到这一点？最好使用jQuery（ajax？）
<?php
require_once 'connect.inc.php';
require_once 'core.inc.php';
?>
<!doctype html>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<link href="http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600,600italic,700,700italic,800,800italic" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="styles.css" type="text/css">
<link rel="stylesheet" href="animate.min.css">
</head>
<body>
<div class="container">
<div class="middlebox">
<a href="index.php"><h1 class="logo">codeforum+</h1></a>
<h3 class="welcometext">Create an account on codeforum+</h3>
<h6>Please fill out all the provided fields to continue with your registration.</h6>
<h6 style="font-size:10px;">Note : You can only register once on this forum, so make it count. Any further registrations will be prohibited, because your IP address will be in our database.</h6>
<hr class="linestyle">
<form action="" method="post">
<div class="form-group">
<div id="username_form" class="input-group <?php // IF USERNAME EXISTS ADD CLASS 'has-warning' ELSE ADD 'has-success' ?>">
<span class="input-group-addon"><i class="fa fa-user fa-fw"></i></span>
<input class="form-control" type="text" placeholder="Enter your username here..." name="username">
</div>
</div>
<div class="form-group">
<div class="input-group <?php // IF EMAIL EXISTS ADD CLASS 'has-warning' ELSE ADD 'has-success' ?> ">
<span class="input-group-addon"><i class="fa fa-envelope fa-fw"></i></span>
<input class="form-control" type="text" placeholder="Enter your email here..." name="email">
</div>
</div>
<div class="form-group">
<div class="input-group <?php // IF PASSWORD HAS NUMBERS,LETTERS, ETC.. ADD CLASS 'has-warning' ELSE ADD 'has-success' ?> ">
<span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
<input class="form-control" type="text" placeholder="Enter your password here..." name="password">
</div>
</div>
<div class="form-group">
<div class="input-group <?php // IF THIS MATCHES THE PASSWORD ADD CLASS 'has-warning' ELSE ADD 'has-success' ?> ">
<span class="input-group-addon"><i class="fa fa-key fa-fw"></i></span>
<input class="form-control" type="text" placeholder="Retype your password here..." name="password_retype">
</div>
</div>
<hr class="linestyle">
<p>Which comparison operator is used to compare variables/values in PHP?</p>
<div class="form-group">
<input class="form-control" type="text" placeholder="Answer the question here..." name="question">
</div>
<div class="checkbox">
<label>
<input type="checkbox" name="checkbox">I agree to the <a href="#">rules</a> of this forum.
</label>
</div>
<p class="rules" style="font-size:10px;">Breaking the rules by any means will result in a permanent ban.</p>
<input class="btn btn-success fullwidth" type="submit" value="Register">
</form>
<?php
if(isset($_POST['username']) && isset($_POST['email']) && isset($_POST['password']) && isset($_POST['password_retype']) && isset($_POST['question']) && isset($_POST['checkbox'])) {
$username = $_POST['username'];
$password = $_POST['password'];
$email = $_POST['email'];
$password_retype = $_POST['password_retype'];
$question = $_POST['question'];
$checkbox = $_POST['checkbox'];
if(!empty($username) && !empty($email) && !empty($password) && !empty($password_retype) && !empty($question) && !empty($checkbox)) {
$sql = "SELECT id FROM users WHERE username='$username'";
if($sql_run = mysql_query($sql)) {
$sql_num_rows = mysql_num_rows($sql_run);
if($sql_num_rows==1) {
// if username exists change class of the form
} else {
// if username doesnt exist - continue
$sql = "SELECT id FROM users WHERE email='$email'";
if($sql_run = mysql_query($sql)) {
$sql_num_rows = mysql_num_rows($sql_run);
if($sql_num_rows==1) {
// if email exists change class of the form
} else {
// if email doesnt exist - continue
}
} else {
// if query failed
}
}
} else {
// if query failed
}
} else {
// if fields are empty
}
}
?>
<a href="landingpage.php"><p class="small" style="margin-top:10px;">Already have an account?</p></a>
</div>
</div>
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript">
</script>
</body>
</html>
<?php
$mysql_error = mysql_error(); // change to 404 when finished
$mysql_database = 'codeforum';
$mysql_host = '127.0.0.1';
$mysql_user = 'root';
$mysql_pass = '';
if(!mysql_connect($mysql_host, $mysql_user, $mysql_pass) || !mysql_select_db($mysql_database)) {
die($mysql_error);
}
?>
答案 0 :(得分：0)
如果您花费更多时间将其缩减为可管理的方案，那么您的问题可能更容易回答，但无论如何你都去了：
您需要一个检查用户名可用性的PHP端点。
为了防止端点滥用，您需要一个PHP会话，并在最后20分钟左右存储尝试次数。如果您的喜好尝试太多，则应该出错。
你需要一个JS处理程序来向上面的端点发出AJAX请求;如果端点没有响应错误，它将应用您的className。
连接你的JS以激活“更改”并使用帮助函数setTimeout在“keyup”上执行相同操作，因此每次用户释放时都不会锤击PHP端点一个关键，但只是在宽限期之后，比如100ms。
返回并针对您的错误情况实施信息性消息，例如“名称存在”和“尝试次数过多”。