jquery hovercard загружается поздно, поэтому отображает пустую hovercard

Question

Я реализовал карту наведения. Он отображает отлично%90 времени. Но иногда он отображает пустую карту hovercard, и я думаю, что он не может загрузить. Кстати, у меня есть веб-сервис, который вызывается, если вы наводите TAG, и он отображает ховеркарту.

Как я могу убедиться, что он загружается, а затем отобразить ховеркарту или Как поставить "Загрузка", пока он не загрузится, и отобразить данные

вот мой код

$('.hovercard_tag').hover(function () {
            var span_text = $(this).text();
            var result = '';
            pos = $(this).offset();
            $.ajax({
                url: 'http://xxx/HoverCard_WebService.aspx?q=' + encodeURIComponent(span_text),
                type: 'GET',
                dataType: 'json',

                beforeSend: function () {
                    $(".hovercard").prepend('<p class="loading-text">Yükleniyor...</p>');
                },
                success: function (data) {
                    $(".hovercard").empty();
                    $.each(data, function (index, value) {
                        result += '<div style=\'border-bottom:1px solid #31B1CE;\'><b>' + span_text + '</b><div style=\'display: block;margin: 4px;font-size:4px;line-height: 4px;\'></div></div>';
                        result += '<div style=\'display: block;margin: 4px;font-size:4px;line-height: 4px;\'></div>';
                        result += value.description;
                        result += '<br /><br />';

                        var image_source = 'images/hover_card_plus_icon.png';
                        if (value.followed != '0')
                            image_source = 'images/ok_icon.png';

                        result += '<div style=\'float:left;\'><img id=\'img_category_follow\' value=\'' + value.id + '\' src=\'' + image_source + '\' class=\'cat_takibe_al\' style=\'cursor:pointer;\' /></div><div style=\'float:right;padding-top:-10px\'>' + value.count + ' kişi takip ediyor</div><div style=\'clear:both\'></div>';

                    });
                },
                complete: function () {
                    //$('.loading-text').remove();
                }
            });

Answer 1

$('#selector').ajaxStart(function(){
    // Show your image here when ajax request begins
});


$('#selector').ajaxComplete(function(){
    //Show what you actually want to show after your ajax request is completed.
});