jQuery 3.3.1 $ .ajax函数错误，不是错误，成功，完整回调函数

Question

jQuery Code

$(document).ready(function(){
  $('.btn').click(function(){
    // get text field value
    var userName = $('.myField').val();
    var emailAddress = '[e-mail]';
    // ajax request and response in function
    $.ajax({
      url: 'process.php', 
      type: 'POST',
      data: 'passVarOne='+userName+'&passVarTwo='+emailAddress,
      success:function(responseAnyNameHere) {
        $('.responseArea').html(responseAnyNameHere);
      },
      statusCode:{
        404:function(){
          $('.error').html("Page not found!");
        },
        200:function(){
          $('.error-not').html("Page found! Its okay.");
        }
      }
    }).error(function(){
      $('.error').html("Some error");
    }).success(function(){
      $('.success').html("Success");
    }).complete(function(){
      $('.success').html("Action completed");
    });
  });
});

PHP Code

<?php
    if( isset($_POST['passVarOne']) || isset($_POST['passVarTwo']) ) {
        echo "Response received ... <br>";

        echo "Name: " . $_POST['passVarOne'];
        echo "<br>";
        echo "Email: " . $_POST['passVarTwo'];

    }
?>

jQuery version is 3.3.1

The Form is below, without form tag

<input type="text" class="form-control myField"> 
<br>
<button class="btn btn-default">Submit</button>

Problem: The response/result is being received. But the call backs are not working. Error messages "$.ajax(...).error is not a function" I have tried

.on("error",function(){...}

but no success. I have tried

jQuery.ajax

I have tried

(function($) { ... })(jQuery);

I have tried .live, .bind and var jqueryObj = $; and some more but call backs are not working or there is some other issue. I am using it on WAMP Server v2.5.

I want the .error, .success and .complete to be working. I have tried searching here and seen other threads but I found that .error was depricated in old jQuery version but I am using new version.

Answer 1

From jQuery ajax page, figured out the solution.

var jqxhr = $.ajax({
            url: 'process.php', 
            type: 'POST',
            data: 'passVarOne='+userName+'&passVarTwo='+emailAddress,
            success:function(responseAnyNameHere) {
              $('.responseArea').html(responseAnyNameHere);
            },
            statusCode:{
              404:function(){
                //$('.error').html("Page not found!");
                alert( "file not found" );
              }
            }
          }).done(function() {
          alert( "success" );
          }).fail(function() {
          alert( "error" );
          }).always(function() {
          alert( "complete" );
        });

This method works perfectly. So done, fail and always work.