javascript - 电子邮件验证并将值提交到数据库中

Question

这个问题已经有答案了:

returning false not stopping the submission of form (3 个回答)

已关闭 7 年前。

我正在尝试验证电子邮件，它也正在得到验证，但即使用户没有输入有效的电子邮件，下面的 php 代码也会将值插入到数据库中。如果有人可以帮助我，请帮助我是初学者。提前致谢。

<script language="javascript">

function checkEmail() {
    var email = document.getElementById('txtEmail');
    var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
    if (!filter.test(email.value)) {
        alert('Please provide a valid email address');
        email.focus;
        return false;
    }
}
</script>


<?php 
error_reporting(E_ALL);
ini_set("display_errors", "On");
$con=mysqli_connect("localhost","root","","xyz");
if (mysqli_connect_errno())
{
    echo "Failed to connect to MySQL: " . mysqli_connect_error();
}
// print_r($_POST); 
if(isset($_POST['submit'])){  
    $user=$_POST['user'];
    echo $user;
    $query = "INSERT INTO Newsletter VALUES('$user')"; 
    if(mysqli_query($con, $query)){ 
         echo "inserted";
    } else { 
         echo "fail";
    }
}
?>

<form action="" method="post">
<div>
<input name="user" id="txtEmail" type="text" class="input-field" 
placeholder="Send us an email of your requirements and we will                  get          back    to you!!"></div>
<div>
<input name="submit" type="submit" class="input-button" value="subscribe" onclick='Javascript:checkEmail();'>
</div>
</form>

Answer 1

此处需要更改提交代码。

当前>>

<input name="submit" type="submit" class="input-button" value="subscribe" onclick='Javascript:checkEmail();'>

将其更改为>>

<input name="submit" type="submit" class="input-button" value="subscribe" onclick='return checkEmail();'>

但理想情况下，您应该将功能验证保留在 FORM onsubmit 事件中，而不是提交按钮的 onclick 事件中。