我有一个已经通过 jquery.validate.min.js 验证的表单，我想要的是另一种验证方法，ajax 调用 mysql 来检查电子邮件地址是否已在我的数据库中。如何合并验证？我已经对代码进行了一些操作，但无法弄清楚。
我的验证码:
$('document').ready(function() {
var email_state = false;
$('#email').on('blur', function() {
var email = $('#email').val();
if (email == '') {
email_state = false;
return;
}
$.ajax({
url: 'index.php',
type: 'post',
data: {
'email_check': 1,
'email': email,
},
success: function(response) {
if (response == 'taken') {
email_state = false;
alert('email is taken');
} else if (response == 'not_taken') {
email_state = true;
alert('email available');
}
}
});
});
});
处理电子邮件检查的 PHP:
<?php
$db = mysqli_connect('localhost', 'user', 'pass', 'subscribers');
if (isset($_POST['email_check'])) {
$email = $_POST['email'];
$sql = "SELECT * FROM subscribers WHERE email='$email'";
$results = mysqli_query($db, $sql);
if (mysqli_num_rows($results) > 0) {
echo "taken";
}else{
echo 'not_taken';
}
exit();
}
?>
最佳答案
看看json_encode您需要做的就是从 php ( check this answer ) 返回一个响应(例如:true 或 false)到 javascript。
然后检查 success js 函数的响应，如果为 true，则电子邮件已在数据库中，并提醒用户，否则，使用电子邮件值提交表单。
有两种方法可以实现此目的，1)为电子邮件字段上的每次击键发出 ajax 请求 $('#email-input').on('keyup')一旦响应为 false，请通过 jquery $('#submit-button').prop('disabled', false) 启用提交按钮请注意，在您的按钮 html 标记中，默认情况下您应该具有禁用属性 <input type="submit" id="submit-button" value="Submit" disabled />验证发生后，您将其禁用，然后它将可单击并且用户将能够提交表单。
问题是，当用户输入电子邮件地址时，您将进行大量的 ajax 调用，而您不希望这样，相反，您可以做的就是在用户输入电子邮件地址时发出请求提交表单(点击提交按钮)，然后阻止默认行为(通过表单发送 post 请求)，以便您通过 ajax 检查电子邮件是否已在使用，如果是，则不要提交表单并显示一条消息，否则，提交表单。
<form id="form" action="http://foo.com" method="post">...</form>
$('#form').on('submit', function (ev) {
ev.preventDefault() // prevent default behaviour (making a post request)
// do your ajax call here to check the email availability
// if it's taken, do nothing and just display a message to the user
// otherwise, submit the form: $(this).submit()
})
干杯。
关于javascript - 验证表单数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48777716/