使用ajax进行JS表单验证，用于电子邮件验证

Question

这里我有一个表单电子邮件验证，但它在服务器端，我希望它在客户端（实时验证）。

我想要用于商业电子邮件检查的表单验证。它接受 gmail.com、yahoo、bing、yopmail 等公共服务

 LtsCustomerRegistration.prototype.handleEvents = function () {
        var _this = this;
        $(".btn-next-step-1").click(function() {
            _this.step1Validation.validate().then(function (status) {
                if (status == 'Valid') {
                    var step1FormData = LtsMain.formSetData('#CustomerSignUpFormStep1');
                    _this.customerSignUp(step1FormData, function(res){
                        $('#customer_id_hidden').val(res.customerId);
                        _this.switchTabs(2);
                    }, 
                    function(res){
                        if(res.status === 'user_exist'){
                            $('#customer_email').parents('.form-group').find('.email-exists-validation-msg').removeClass('d-none');
                            $('#multi-step-form').animate({
                                scrollTop: 0
                            }, 1000);
                        } else if(res.status === 'invalid_email'){
                            $('#customer_email').parents('.form-group').find('.email-invalid-validation-msg').removeClass('d-none');
                            $('#multi-step-form').animate({
                                scrollTop: 0
                            }, 1000);
                        }
                    });
                }
            });
        });   

this validation is Check the user email invalid or not, in the submit button Click 
this pass to a method in symfony "customerSignUp"


here is validation is client side real time validation.

Answer 1

$('#customer_email').on('input', function () {
        // Get the entered email value
        var email = $(this).val();

        // Validate the email using a regular expression
        var emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        var isValid = emailRegex.test(email);

        // Display validation messages based on the result
        if (isValid) {
            // Email is valid, hide any existing error messages
            $('.email-validation-msg').addClass('d-none');
        } else {
            // Email is invalid, show an error message
            $('.email-validation-msg').removeClass('d-none');
        }
    });