JSFiddle - React, Tailwind, and code Playground

by jacomyal

HTML

<ul class="log">
</ul>

JavaScript

// According to the jQuery.ajax documentation, the success callback takes as
// third argument a reference to the jqXHR object, regardless of you are giving
// the success method from the parameters object calling .ajax (first example),
// through the .done() method (second example) or with the .then() method (last
// example).

// But it looks like it does not work with the .then() method. Any idea?
// jQuery.ajax documentation: http://api.jquery.com/jquery.ajax/

// Tested with jQuery v1.11.0 and v2.1.0.

var xhrClassic = $.ajax({
  url: '/echo/html/',
  success: function(data, textStatus, jqXHR) {
    log(
      'Classic:',
      jqXHR === xhrClassic
    );
  }
});

var xhrDone = $.ajax('/echo/html/')
  .done(function(data, textStatus, jqXHR) {
    log(
      'Using .done():',
      jqXHR === xhrDone
    );
  });

var xhrThen = $.ajax('/echo/html/')
  .then(function(data, textStatus, jqXHR) {
    log(
      'Using .then():',
      jqXHR === xhrThen
    );
  });

var logList = $('ul.log');
function log() {
  logList.append(
    '<li>' +
      [].join.call(arguments, ' ') +
    '</li>'
  );
}