Выполнять две функции последовательно с jQuery

Question

У меня есть две функции. Мне нужно запустить fOne() перед fTwo().

function fOne() { 
    if ($('.container').width() < 300) { 
    $('.box').each(function(){ 
      $(this).removeClass('largeSize').addClass('smallSize'); 
    }); 
    } 
} 

function fTwo() { 

    var el = $('.myElement'); 

    $(el).each(function() { 
     var pcntH = el.height(), 
      scorH = el.parent().find('.box').outerHeight(true), 
      pcntT = scorH - pcntH - 5; 

     el.css({'position':'relative', 'top': pcntT + 'px'}).fadeIn('slow'); 
    }); 
} 

Можно ли сделать что-то вроде этого:

fOne().done(fTwo()); 

Это идея, но не работает ...

Answer 1

Просто используйте функцию обратного вызова. В определении

function fOne(callback) { 
    if ($('.container').width() < 300) { 
    $('.box').each(function(){ 
      $(this).removeClass('largeSize').addClass('smallSize'); 
    }); 
    } 
    callback(); 
} 

, а затем сделать вызов fOne(fTwo);. Вы настроены.

Answer 2

Если вы не вызывая их асинхронно FONE(); fTwo(); должны работать, иначе fOne(); return fTwo();

Answer 3

jQuerys when и done могут использоваться для выполнения операции async, поскольку они используют Deffereds. Функция, которая отправляется в when, будет выполнена, и только после завершения этой функции она вызовет функцию, определенную done.

$.when(fOne()).done(function() { fTwo(); }); 

Вы можете проверить его на api.jquery.com