原生js封装插件

// formValidator.js
const FormValidator = {
    validateEmail: function(email) {
        const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
        return re.test(email);
    },
    validateRequired: function(value) {
        return value.trim() !== '';
    },
    validateForm: function(form) {
        const inputs = form.querySelectorAll('input[required]');
        let isValid = true;
        inputs.forEach(input => {
            if (!this.validateRequired(input.value)) {
                isValid = false;
                input.style.borderColor = 'red';
            } else {
                input.style.borderColor = '';
            }
        });
        const emailInput = form.querySelector('input[type="email"]');
        if (emailInput && !this.validateEmail(emailInput.value)) {
            isValid = false;
            emailInput.style.borderColor = 'red';
        } else if (emailInput) {
            emailInput.style.borderColor = '';
        }
        return isValid;
    }
};

// 使用示例
document.querySelector('form').addEventListener('submit', function(event) {
    if (!FormValidator.validateForm(this)) {
        event.preventDefault();
        alert('表单验证失败，请检查输入！');
    }
});