逐个验证表单的字段

我有一个包含7个字段的表单。当我将它提交到"register.php"页面时，它将逐一处理每个字段并输出结果。但这将输出整个结果。但我需要使用ajax验证数据，并逐个收集输出，并在离开字段时将其显示给用户。

在验证之后，我还需要在一次点击中发送所有字段；通过使用提交按钮。

html文件

<form action="register.php" method="post" class="ajax">
        <ul>
            <li>Username*:<br> <input type="text" name="username" required></li>
            <li>Password*:<br> <input type="password" name="password" required></li>
            <li>Confirm the Password*:<br> <input type="password" name="password_again" required></li>
            <li>First Name*:<br> <input type="text" name="first_name" required></li>
            <li>Last Name:<br> <input type="text" name="last_name"></li>
            <li>Email*:<br> <input type="text" name="email" required></li>
            <li><input type="submit" value="Register"></li>
        </ul>
    </form>

register.js文件

$('form.ajax').on('submit',function(){
var that = $(this),
    url = that.attr('action'),
    type = that.attr('method'),
    data = {};
that.find('[name]').each(function(index,value){
    var that =$(this),
        name =that.attr('name'),
        value = that.val();
        data[name] = value;
}); 
$.ajax({
    url: url,
    type: type,
    data: data,
    success: function(response) {
        document.getElementById("demo").innerHTML= response;
    }
});
return false;

})；

我的php文件：

     if (empty($errors)=== TRUE) {
     if (user_exists($_POST['username'])=== TRUE) {
         $errors[] = 'Sorry, the Username '''. $_POST['username'] . ''' is already in use';
     }
     if (preg_match("/''s/", $_POST['username'])== TRUE) {
         $errors[] = 'Username must not contain any spaces';
     }
     if (strlen($_POST['password']) < 6) {
         $errors[] = 'Your password must be at least 6 characters';
     }  
     if ($_POST['password'] !== $_POST['password_again']) {
         $errors[] = 'Passwords do not match';
     }  
     if (filter_var($_POST['email'], FILTER_VALIDATE_EMAIL)=== FALSE) {
         $errors[] = 'Invalid email address';
     }
     if (email_exists($_POST['email']) === TRUE) {
         $errors[] = 'Sorry, the email address '''. $_POST['email'] . ''' is already in use';
     }
 }
 }

if (isset($_GET['success']) && empty($_GET['success'])) {
    echo "You've been registered successfully!";
}
else{
    if (empty($_POST)=== FALSE && empty($errors) === TRUE) {
        $register_data = array(
            'username'  => $_POST['username'],
            'password'  => $_POST['password'],
            'first_name'=> $_POST['first_name'],
            'last_name' => $_POST['last_name'],
            'email'     => $_POST['email'],
        );
        register_user($register_data);
        header('Location: register.php?success');
        exit();
    }else if(empty($errors)=== FALSE){