jquery - 将加载图形添加到 JQuery UI Ajax 选项卡？

Question

如何将加载图形添加到 JQuery UI ajax 选项卡？所以它会暂停半秒，显示图形然后加载内容？

这是我的代码:

<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

来自 UI 示例@ http://jqueryui.com/demos/tabs/#option-spinner

加载远程内容时，该字符串的 HTML 内容显示在选项卡标题中。传入空字符串以停用该行为。标题的 A 标记中必须存在 span 元素，微调器内容才可见。

Get or set the spinner option, after init.

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

所以你的代码是:

$(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?");
            },
spinner: '<img src="/image/Pi5r5.gif" />'


        }
    });
});