特定域名的电子邮件验证

Question

我有以下表格。 我想验证电子邮件字段。当用户单击“提交”时， 它只应包含域名“ @ somename.com ”。

仅当单击复选框以显示电子邮件字段时，才应验证邮件。

如果电子邮件无效，我想阻止提交

<form class="form-horizontal" id="rForm" data-toggle="validator" role="form">

                        <div class="form-group">
                            <div class="col-xs-offset-3 col-xs-8">
                                <label class="checkbox-inline col-xs-10">
                                    <input type="checkbox" ID="chkbx"> Email 
                                </label>
                            </div>

                        </div>
                        <div class="form-group email">
                            <div class="col-xs-offset-3 col-xs-8">

                                <div class="col-xs-8">
                                    <input type="text" class="form-control "  placeholder="Enter email">
                                </div>
                            </div>
                        </div>

                                <div class="form-group">
                            <div class="col-xs-offset-3 col-xs-8">
                                <input type="reset" class="btn btn-default" id="rset" value="Reset">
                                <input type="submit" class="btn btn-primary" id="submit" value="Submit">
                            </div>
                        </div>
                    </form> 

JS

 $("#submit").on('keypress click', function(e){
            e.preventDefault();
$('#chkbx').hide();
$('#chkbx').click(function () {
       // This will show / hide your element accordingly
       $('.email').toggle();
});


    });

Answer 1

签出JavaScript RegEx以确定电子邮件的域（例如yahoo.com） 。 您可以使用它并扩大示例：

 $('#chkbx').click(function() { // This will show / hide your element accordingly $('.email').toggle(); }); $("#submit").on('click', function(e) { e.preventDefault(); if ($('#chkbx').is(':checked')) { // https://stackoverflow.com/questions/3270185/javascript-regex-to-determine-the-emails-domain-yahoo-com-for-example console.log(/@testdomain.com\\s*$/.test($('#email_input').val())); } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <form class="form-horizontal" id="rForm" data-toggle="validator" role="form"> <div class="form-group"> <div class="col-xs-offset-3 col-xs-8"> <label class="checkbox-inline col-xs-10"> <input type="checkbox" ID="chkbx" checked>Email </label> </div> </div> <div class="form-group email"> <div class="col-xs-offset-3 col-xs-8"> <div class="col-xs-8"> <input id="email_input" type="text" class="form-control " placeholder="Enter email"> </div> </div> </div> <div class="form-group"> <div class="col-xs-offset-3 col-xs-8"> <input type="reset" class="btn btn-default" id="rset" value="Reset"> <input type="submit" class="btn btn-primary" id="submit" value="Submit"> </div> </div> </form> 

Answer 2

使用以下功能测试您的电子邮件。 编辑：

您首先需要在电子邮件输入字段中添加name=和id= 。...因此，您需要做的是：

<input type="text" class="form-control " placeholder="Enter email" name="email" id="email">

然后执行：

function testEmail(string) {
    var regex = /.+@somename.com$/i;
    return regex.test(string);
}

//testEmail("nope@test.com"); // false
//testEmail("what@somename.com.other"); //false
//testEmail("yeah@somename.com"); //true
//testEmail("@somename.com"); // false

$('form').submit(function(e){
    var values = $('form').serialize();
    if(!testEmail(values.email)) 
        e.preventDefault();
    // your submission code goes here.
})