javascript - 验证该值不在数据库中

Question

我正在尝试验证输入的电子邮件地址是否已存在于我的数据库中。我有以下代码:

这是我的 html 中的表单

<form action="signup.php" method="post" onsubmit="return validateForm(this);">
                <input type="text" name="First_name" placeholder="First Name" required pattern="[A-Za-z].{2,}" maxlength="20" oninvalid="this.setCustomValidity('Must be between 2 and 20 characters long and no numbers!')"/>
                <input type="text" name="Last_name" placeholder="Last Name" required pattern="[A-Za-z']..{2,}" maxlength="20" oninvalid="this.setCustomValidity('Must be between 2 and 20 characters long! and no numbers')"/>
                <input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" name="Email" required placeholder="Email Address" maxlength="30" oninvalid="this.setCustomValidity('Must be a validate Email Address!')"/>
                <input type="email" pattern="[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,4}$" name="Email2" required placeholder="Comfirm Email Address" maxlength="30" oninvalid="this.setCustomValidity('Must be a validate Email Address!')"/>
                <input type="password" name="Password" placeholder="Password" required maxlength="20" required pattern=".{6,}" oninvalid="this.setCustomValidity('Must be between 6 and 20 characters long!')"/>
                <input type="Submit" value="Submit" name="Submit" id="Submit"/>
              </form>

这是我的 html 顶部的 jquery:

<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  //result texts
  var email_error = 'Emails do not match!';
  alert("Hi");
  //when button is clicked
  $('#Submit').click(function(){
    //run the character number check
    if($('#Email').val() != $('#Email2').val()){
      //if it's bellow the minimum show characters_error text '
      $('#emailValidate').html(email_error);
    }else{
      //else show the cheking_text and run the function to check
      check_availability();
    }
  });

});

//function to check username availability
function check_availability(){

    //get the username
    var Email = $('#Email').val();

    //use ajax to run the check
    $.post("checkmail.php", { Email: Email },
      function(result){
        //if the result is 1
        if(result == 1){
          //show that the username is available
          $('#emailValidate').html(Email + ' is Available');
        }else{
          //show that the username is NOT available
          $('#emailValidate').html(Email + ' is not Available');
        }
    });

}
</script>

这是我的 php 文件

<?php
$servername = "localhost";
$username = "root";
$password = "root";
$DB = "database";

// Create connection
$conn = mysqli_connect($servername, $username, $password, $DB);

// Check connection
if ($conn->connect_error) {
    die("Connection failed: " . $conn->connect_error);
} 

$sql = "SELECT Email FROM Users WHERE Email = '".$_POST['Email']."'";
$select = mysqli_query($conn, $sql);
$row = mysqli_num_rows($select);

if($row > 0)) {
  echo 1;
}else 
echo 0;
?>

现在，当我单击“提交”时，逻辑不会发生任何变化。由于某种原因，它没有检测到提交并且没有评估。我使用 Submit 作为 id，但它没有接收到它。我是否错误地处理了这个问题？

Answer 1

您可以使 SQL 数据库列必须是唯一的。因此，SQL 会为您完成此操作，您只需提交表单即可。如果有一封电子邮件与提交的电子邮件匹配，SQL 将抛出约束错误。