jQuery form validation

Small Demo:

< script > 
    $( function () {
         // Bind username to lose focus event 
        $( " #username " ).blur( function () {
             // Get the value of username text box 
            var nameValue = $( this ).val( );
             // Clear data every time 
            $( " table font:first " ).remove();
             // Check if username is valid 
            if (nameValue ==  "" ) {
                $( this ).parent().append( " <font class='error' color = 'red'>The username you entered is empty</font> " );
            } else {
                $(this).parent().append("<font  color = 'blue'>可以使用!</font>");
            }
        });
        // Bind the lost focus event to the mailbox 
        $( " #email " ).blur( function () {
             // Get the value of the text box 
            var myemail = $( this ).val();
             // Clear it every time it loses focus The previous data 
            $( " #email+font " ).remove();
             // Define mailbox check regular 
            var reg =  / ^\w{6,20}@(\w{2,6}\.)+\ w{2,6}$ / ;
             if (reg.test(myemail)) {
                $(this).parent().append("<font color = 'blue'>邮箱合法!</font>");
            } else {
                $(this).parent().append("<font class='error' color = 'red'>邮箱不合法!</font>");
            }
        });
        // Bind the form submit event (whether the form is submitted or not is determined by the form's submit event returning true or false) 
        $( " form " ).submit( function () {
             // Actively trigger the input box's loss of focus event 
            $( " : text,:password " ).trigger( " blur " );
             // font to determine if there is an Error in the page 
            if ($( " .error " ).size() >=  1 ) {
                 return  false ;
            }
            return true;
        });
    });
</script>

 

Guess you like

Origin http://43.154.161.224:23101/article/api/json?id=324941923&siteId=291194637