Using promise() in older versions of jQuery

Question

I'm working on a website with jQuery 1.4. I cannot update it (which sucks, really).

I have followed @benekastah answer from this question to make a text appear word-by-word. It uses a promise() method at the end which I can't use, because promise() is since v. 1.6.

Here's the complete code

var $el = $(".example:first"), text = $.trim($el.text()),
    words = text.split(" "), html = "";

for (var i = 0; i < words.length; i++) {
    html += "<span>" + words[i] + ((i+1) === words.length ? "" : " ") + "</span>";
};
$el.html(html).children().hide().each(function(i){
  $(this).delay(i*200).fadeIn(700);
});
$el.find("span").promise().done(function(){
    $el.text(function(i, text){
       return $.trim(text);
    });            
});

The rest of the code is working fine.

My question is, is there an alternative? I've search for methods used before 'promise()` came in but couldn't find them, all I found was a plugin but I was thinking of something more simple.

No need to say I'm quite a JS noobie ^^. Any help much appreciated.

ahren · Accepted Answer · 2013-11-21T13:01:38.687

Basically, you can code this in vanilla JS using a simple setTimeout - even if it is a bit ugly, you're dealing with jQuery 1.4 so you don't have much of a choice.

setTimeout(function(){
    $el.text(function(i, text){
       return $.trim(text);
    });            
}, $el.children().length * 200 + 500);

Here's a demo: http://jsfiddle.net/jdfmS/ (I've added a red class in the demo, so you can see where it executes)

Another option (turns out you did have a choice!) is to use .queue() - which was added in jQuery v1.2

$el.find("span").last().queue(function(){
    $el.text(function(i, text){
       return $.trim(text);
    });
    $(this).dequeue();
});

Here's a demo for .queue(): http://jsfiddle.net/jdfmS/1/

Using promise() in older versions of jQuery

1 Answers1