-
测试1.php
<html>
<head>
<script type="text/javascript" src="js/jquery-1.11.1.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#username').change(function(){
var userName = $('#username').val();
$.post("getUserName.php", {userName: userName}, function(data){
$("#userNameCheck").html(data);
});
});
$('#submit').click(function(){
//CODE HERE
});
});
</script>
</head>
<body>
<form action="" method="post" id="addform">
Username: <input type="text" name="username" id="username" size="24" class="required" maxlength="22" />
<div id="userNameCheck"></div>
<input type="submit" id="submit" name="submit" value="ADD user" />
</form>
</body>
</html>
-
获取用户名.php
<?php
include("db.php");
$userName = $_POST['userName'];
$q = "select user_name from user where user_name = '".$userName."'";
$r = mysqli_query($dbc, $q);
$num = mysqli_num_rows($r);
if($num)
{
echo '<div style="color:red">Username taken. Please type another new one.
</div>';
}
else
{
echo '<div style="color:green">You can use it.</div>';
}
?>
数据库(用户表)
用户 ID 用户名
1 阿里
2 阿布
由上可知:
=> 输入“ali” 在文本框上 -> 以绿色显示“您可以使用它”消息。
=> 类型ahmad在文本框上 -> 以红色显示“用户名已被占用...”消息。
我的要求是如果消息是“你可以使用它”,请转到test2.php;如果消息是“用户名已被占用...”,则不会在表单上提交。
我的问题是,当我单击提交按钮时,如何控制“您可以使用它”或“用户名已被占用”消息?
不要使用按钮的单击处理程序,而是使用表单提交事件。
$(document).ready(function () {
$('#username').change(function () {
var userName = $('#username').val();
$.post("getUserName.php", {
userName: userName
}, function (data) {
$("#userNameCheck").html(data);
});
});
$('#addform').submit(function () {
//if the text is `You can use it` allow the form submit else block it
return $("#userNameCheck").html().trim() == 'You can use it';
});
});
还要确保您在中进行相同的验证test2.php
因为,客户端验证可以被回避。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)