Ajax延迟仿真

I have a small ajax jquery script which returns some XML for me. Whilst it is working and communicating with the server I am displaying a loader animation.

The problem is I don't see the animation. Either I have done something wrong or the network conection is really quick.

Does anyone know how I can introduce a delay to my ajax code to slow the process down and I can test the animation feature?

Thank you.

ps: ajax code is below, just incase

function fetchData($nodeid, $area){
    if( $nodeid != $currentRoomId ){
        popupBox($area);//$area, $roomInfo);
    }

        var $nid, $title, $classroom, $boardroom, $cabaret;
        $.ajax({

            url: "/room/" + $nodeid + "/rss.xml",
            dataType: "xml",
            success: function($xml){

                $returnXML  =   $xml;
                $($xml).find('node > *').each(
                    function(){

                        switch( $(this).attr('name') ){
                            case 'Nid':
                                $nid    =   $(this).text();
                            break;
                            case 'Title':
                                $title  =   $(this).text();
                            break;
                            case 'Classroom':
                                $classroom  =   $(this).text();
                            break;
                            case 'Boardroom':
                                $boardroom  =   $(this).text();
                            break;
                            case 'Cabaret':
                                $cabaret    =   $(this).text();
                            break;
                            case 'Theatre':
                                $theatre    =   $(this).text();
                            break;
                            case 'Notes':
                                $notes  =   $(this).text();
                            break;
                            default:
                            break;
                        }//close switch statement
                    }
                );
                $roomInfo   =   new Array();
                $roomInfo.push('Title', $title);
                $roomInfo.push('Classroom', $classroom);
                $roomInfo.push('Boardroom', $boardroom);
                $roomInfo.push('Cabaret', $cabaret);
                $roomInfo.push('Theatre', $theatre);
                $roomInfo.push('Notes', $notes);
                highlightRow($nid);
                popupBox($area, $roomInfo);
            },
            statusCode: {
                200: function(){
                    //alert('responding just fine!');
                }
            },
            error: function(){
                //alert('Ajax not responding!');
            },
            complete: function(){
                //alert('completed!');
            }
        });
    }

You can use the setTimeout to introduce a delay.

Quick solution is to move your ajax call inside the if block. On success/error - hide the animation. That won't simulate a delay, but it'll ensure that your animation gets displayed (even if for ms).

If you have control of your server code, you could make the server delay the AJAX response by adding a delay in your server code, rather than causing a delay in the client.