通过jquery验证Email表单

在提交表单数据到服务器之前，通常需要在客户端进行一次验证，以确保用户提交数据的有效性。

通过jquery，我们可以对用户填写的Email地址进行验证。下面的代码片段完成了对Email表单字段的验证。

(function ($) {
    $.fn.validateEmail = function () {
        return this.each(function () {
            var $this = $(this);
            $this.change(function () {
                var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
                if ($this.val() == "") {
                    $this.removeClass("badEmail").removeClass("goodEmail")
                }else if(reg.test($this.val()) == false) {
                    $this.removeClass("goodEmail");
                    $this.addClass("badEmail");
                }else{
                    $this.removeClass("badEmail");
                    $this.addClass("goodEmail");
                }
            });
        });
    };
})(jQuery);

在代码中，如果用户输入的是合法的Email地址，例如example@example.example，那么就会为字段添加goodEmailclass类，否则添加badEmailclass类。