javascript - 使用 php 的 Ajax 电子邮件可用性检查不起作用
问题描述
我想检查电子邮件的可用性,但它不起作用。而且我是 javascript 和 ajax 的新手,请帮助我。
他是我的代码电子邮件输入,带有跨度以显示输出(现在没有输出)
<input class="input--style-4" id="email" type="email" name="email" required>
<span id="user-availability-status"></span>
JS
<script>
$(document).ready(function() {
$('#email').blur(function() {
var email = $(this).val();
$.ajax({
url: 'includes\emailAvailability.php',
method: "POST",
data: {
email_val: email
},
success: function(data) {
if (data != 0) {
$('#user-availability-status').html('<span>Username blah not available</span>');
$('#register').attr("disabled", true);
} else {
$('#user-availability-status').html('<span>Username blah Available</span>');
$('#register').attr("disabled", false);
}
}
})
});
});
</script>
PHP 文件
<?php
if (isset($_POST["email_val"])) {
include("DbConn.php");
$email = mysqli_real_escape_string($conn, $_POST["email_val"]);
$query = "SELECT * FROM customer WHERE email = '" . $email . "'";
$result = mysqli_query($conn, $query);
echo mysqli_num_rows($result);
}
解决方案
您应该检查我在评论中提到的链接,它是您的完整答案。
这是您的代码的简单示例。
include("DbConn.php");
// Set alerts as array
$error = "";
// I should just trrim and let you check if email is empty .lol
if (empty($_POST["email_val"])) {
$error .= "<p class='error'>Fill email value.</p>";
//Check if this is a real email
} elseif(!filter_var($_POST["email_val"],FILTER_VALIDATE_EMAIL)){
$error .= "<p class='error'>Wrong email type.</p>";
}else{
$email = mysqli_real_escape_string($conn, $_POST["email_val"]);
//You should use prepare statement $email, Shame on you .lol
$query = "SELECT * FROM customer WHERE email = '{$email}'");
$result = mysqli_query($conn, $query);
echo mysqli_num_rows($result);
$error .= "ok";
}
$data = array(
'error' => $error
);
这个Jquery:
$(document).ready(function(){
$('#myform').submit(function(event){
event.preventDefault();
var formValues = $(this).serialize();
$.ajax({
url:"includes\emailAvailability.php",
method:"POST",
data:formValues,
dataType:"JSON",
success:function(data){
if(data.error === 'ok'){
$('#result').html(data.error);
} else {
$('#result').html(data.error);
$('#myform')[0].reset();
}
}
});
});
});
和HTML:
<form id="myform">
<input class="input--style-4" id="email" type="email" name="email_val">
<span id="result"></span>
<button type="button" class="btn btn-primary">Send</button>
</form>
推荐阅读
- c# - 为什么会触发带有事件消息“发生未处理的异常”的“事件代码 3005”?
- javascript - 让愚蠢的组件更聪明一点
- python - 更新/合并和更新熊猫列的子集
- r - 从R中的普通数据框创建权重节点和边列表?
- java - 绘制组件似乎导致光标和标签的鼠标侦听器不起作用
- java - 来自 Spring RestTemplate 的 IOException 未被自定义 ResponseErrorHandler 拾取
- javascript - 我如何存储照片的顺序?
- javascript - 如何防止 jquery 可调整大小的 div 接收调整大小的点击事件
- sql - 时间戳问题 - 不一致的行为 - PostgreSQL
- javascript - protonmail.com 究竟使用什么所有小节来制定最终的 PGP 签名?