javascript - 使用 php 提交表单，通过 javascript 检查电子邮件

Question

第一次发帖，长期读者，所以我会开门见山。

我正在为学校做一个项目，这个问题有点超出了项目的要求，但一旦完成，它看起来会很棒。我有 3 段不合作的代码——一段 html/php、一段 php 和 javascript。

我的代码的最终目标是: 这是一个表格，请提交您的电子邮件，如果它是 @trnty.edu 地址(我的学校)，请提交该表格。 目前的问题是表单提交了空白数据——证明我的 sql 服务器上有许多空行。

我已经测试过手动设置变量，它确实有效(通过 emailsubmit.php 代码)，emailcheck.js 代码确实检查正确的电子邮件，但是他们不与彼此正确。

你介意帮我一下吗？我已经花了大约 3 周的时间通过 Google 搜索这个(和其他)网站以寻找可能的解决方案。非常感谢! (我的表单代码来自主页)

    <div id="signupform">
    <form id="signup" action="scripts/emailsubmit.php" method="POST">
        <input type="email" name="email" placeholder="school email address" />
            <button id="sub">Submit</button>
    </form>

我当前的 Javascript -- 我不知道该填什么或如何填空白...

$(function(){
$('#signup').submit(function() 
    {
        if(validateEmail($('input').val()))
            {
                return true;
            }
        else
        {
                return false;
        }
});

    function validateEmail(email)
    {
    var re = /^\s*[\w\-\+_]+(\.[\w\-\+_]+)*\@[\w\-\+_]+\.[\w\-\+_]+(\.[\w\-\+_]+)*\s*$/;
    if (re.test(email)) 
        {
            if (email.indexOf('@trnty.edu', email.length - '@trnty.edu'.length) !== -1) 
                {
                    //alert('Submission was successful.'); //if true, submit form -- see video
                    return true;
                }
                 else 
                    {
                        alert('Email must be a Trinity email address (your.name@trnty.edu).');
                       return false;
                    }
        } 
        else {alert('Not a valid e-mail address.');}
    }


    });

Myphp 代码。

    <?php
    $dbhost = 'localhost';
    $dbuser = 'service';
    $dbpass = '!@#$%';
    $db = 'tbv_main';
    $con = mysqli_connect($dbhost,$dbuser,$dbpass,$db);

    //$email = $_POST['email'];
    //$email = 'itworked@kickass.net';
    $sql = "INSERT INTO stage1 (email, counter) VALUES ('$email', NULL)";

    if (!mysqli_query($con,$sql))
        {
            die('Error: ' . mysqli_error($con));
        }
    echo "Email: $email , 1 record added";
    ?>

Answer 1

您的 jQuery .submit() 正在取消默认表单提交 return false; 但没有 ajax 将数据发送到服务器，所以您真正想要的是什么要做的就是在负面警报后返回 false，并在正则表达式通过时返回 true，然后在提交函数中检查它。

$('#signup').submit(function() {
    if(validateEmail($('input').val())){
        return true;
    }else{
        return false;
    }
});

然后在您的验证函数中。

var re = /^\s*[\w\-\+_]+(\.[\w\-\+_]+)*\@[\w\-\+_]+\.[\w\-\+_]+(\.[\w\-\+_]+)*\s*$/;
if (re.test(email)) {
    if (email.indexOf('@trnty.edu', email.length - '@trnty.edu'.length) !== -1) 
        {
            //alert('Submission was successful.'); //if true, submit form -- see video
            return true;
        }
     else {
        alert('Email must be a Trinity email address (your.name@trnty.edu).');
        return false;
    }
} else {
    alert('Not a valid e-mail address.');
    return false;
}
return false;

这样做时，当正则表达式正确验证时，您的表单将提交，并且页面将刷新，导致您的 php 代码触发。