Добавить графику загрузки в пользовательский интерфейс JQuery Ajax?

Question

Как добавить загрузочную графику на вкладки AJAX JQuery UI?Таким образом, он приостанавливается на полсекунды, отображает графику и затем загружает содержимое?

Вот код, который у меня есть:

<script type="text/javascript">
$(function() {
    $("#tabs").tabs({
        ajaxOptions: {
            error: function(xhr, status, index, anchor) {
                $(anchor.hash).html("I tried to load this, but couldn't. Try one of the other links?");
            }


        }
    });
});

Это тип графики, которую я хочу использовать в случае, если выне уверены:

Спасибо!

Answer 1

Из примеров пользовательского интерфейса @ http://jqueryui.com/demos/tabs/#option-spinner

HTML-содержимое этой строки отображается в заголовке вкладки во время загрузки удаленного содержимого.Передайте пустую строку, чтобы отключить это поведение.Элемент span должен присутствовать в теге A заголовка, чтобы содержимое счетчика было видно.

Get or set the spinner option, after init.

    //getter
    var spinner = $( ".selector" ).tabs( "option", "spinner" );
    //setter
    $( ".selector" ).tabs( "option", "spinner", 'Retrieving data...' );

ТАК ваш код будет выглядеть так: