replace text information

I would like to replace text information in my (#loader) div. I am using two functions show_info() and replace_info().

$('#measure_submit').click(function(){
        show_info("Sending params ...");
        get_data();
    });

function get_data(){
    $.ajax({
            url: '/controller/view',
            data : { ... },
            type: 'POST',
            typedata: 'text',

            success: function(data){
                hide_info();
            },
            beforeSend : function(data) {
                replace_info("Loading data ...");
            }
        开发者_运维技巧});

function show_info(string){
        $('#loader').text(string);
        $('#info_box').fadeIn(2000);
    }

function replace_info(string){
    $('#loader').fadeOut(2000);
    $('#loader').text(string);
    $('#loader').fadeIn(2000);

}

But I am able to see only the text "Loading data ...". The "Sending params ..." is totally skipped even if there is fadeOut(2000).

I was even trying setTimeout(replace_info("Loading data ..."),4000); but no LUCK.

Anyone knows where is the trouble? Any help is much appreacited.

Thanks Peter

You're seeing this because .text() isn't a queued function like animations are, instead you'll have queue it, or call it with .fadeOut() finishes, like this:

function replace_info(string){
  $('#loader').fadeOut(2000, function() { $(this).text(string); }).fadeIn(2000);
}

The .queue() version would look like this:

function replace_info(string){
  $('#loader').fadeOut(2000)
              .queue(function(n) { $(this).text(string); n(); })
              .fadeIn(2000);
}