这是我添加的验证码作品的基本注册模块
<form method="post" action="<?php echo $_SERVER['PHP_SELF']; ?>" class="form-register" role="form" id="register-form">
<div>
<input name="name" id="name" type="text" class="form-control" placeholder="User name">
<span class="help-block"></span>
</div>
<div>
<input name="email" id="email" type="email" class="form-control" placeholder="Email address" >
<span class="help-block"></span>
</div>
<div>
<input name="password" id="password" type="password" class="form-control" placeholder="Password">
<span class="help-block"></span>
</div>
<div>
<input name="confirm_password" id="confirm_password" type="password" class="form-control" placeholder="Confirm Password">
<span class="help-block"></span>
</div>
<div>
<td id="imgparent">
<div id="imgdiv">
<img id="img" src="captcha.php">
</div>
<img id="reload" src="images/reload.png">
<input id="captcha1" name="captcha" type="text" class="form-control" placeholder="Enter captcha">
</td>
</tr>
<span class="help-block"></span>
</div>
<button class="btn btn-block bt-login" id="button" type="submit">Sign Up</button>
<h4 class="text-center login-txt-center">Alternatively, you can log in using:</h4>
<a class="btn btn-default facebook_rnd" href="login.php?type=facebook"> <i class="fa fa-facebook modal-icons-rnd"></i> </a>
<a class="btn btn-default google_rnd" href="login.php?type=google"> <i class="fa fa-google-plus modal-icons-rnd"></i> </a>
</form>
它是注册.js
$(document).ready(function(){
$("#register-form").validate({
submitHandler : function(e) {
$(form).submit();
},
rules : {
name : {
required : true
},
email : {
required : true,
email: true,
remote: {
url: "check-email.php",
type: "post",
data: {
email: function() {
return $( "#email" ).val();
}
}
}
},
password : {
required : true
},
confirm_password : {
required : true,
equalTo: "#password"
}
},
messages : {
name : {
required : "Please enter name"
},
email : {
required : "Please enter email",
remote : "Email already exists"
},
password : {
required : "Please enter password"
},
confirm_password : {
required : "Please enter confirm password",
equalTo: "Password and confirm password doesn't match"
}
},
errorPlacement : function(error, element) {
$(element).closest('div').find('.help-block').html(error.html());
},
highlight : function(element) {
$(element).closest('div').removeClass('has-success').addClass('has-error');
},
unhighlight: function(element, errorClass, validClass) {
$(element).closest('div').removeClass('has-error').addClass('has-success');
$(element).closest('div').find('.help-block').html('');
}
});
});
它适用于验证码 js
// JavaScript Document
$(document).ready(function() {
// Change CAPTCHA on each click or on refreshing page.
$("#reload").click(function() {
$("#img").remove();
$('<img id="img" src="captcha.php" />').appendTo("#imgdiv");
});
// Validation Function
$('#button').click(function() {
var name = $("#username1").val();
var email = $("#email1").val();
var captcha = $("#captcha1").val();
if (name == '' || email == '' || captcha == '') {
} else {
// Validating CAPTCHA with user input text.
var dataString = 'captcha=' + captcha;
$.ajax({
type: "POST",
url: "verify.php",
data: dataString,
success: function(html) {
if ($.trim(captcha) == '2') {
alert('Entered code is wrong');
reloadCaptcha();
return false;
}
validated = true;
$("#button").submit();
alert(html);
}
});
}
});
});
在这里,当所有验证都工作正常时,但如果验证码是错误的,那么它也提交他的表格为什么>>?
当验证码被磨损时如何停止恢复形式??
你在这里做的事情从来都不是你想用验证码做的事情。
验证码存在的原因是防止恶意表单提交,这意味着您不应该在没有有效验证码的情况下向服务器提交任何数据。但是,您正在做的是在Javascript中验证验证码,然后提交表单。
没有什么能阻止某人手动调用 $('#button').submit() 将他们喜欢的任何数据推送到服务器。验证码基本上是无用的;它就像一扇没有围墙的门。
您需要重新实施验证码解决方案,以便在服务器端进行验证,无论您的表单提交到何处。首先验证验证码,然后处理表单提交。
你可以使用这样的东西:
session_start();
if($_POST['captcha'] != $_SESSION['<insert Captcha Session key here>']) { /* invalid captcha */ }