显示带有自定义标签的微调器

Question

$('#widget .tabs li a').click(function (e) {
        $('#widget .tabs li').removeClass('ui-tabs-active');
        $(this).parent().addClass('ui-tabs-active');
        $('.group-tabContent').hide();
        var url = $(this).attr('href');
        $('.group-tabContent').empty().load(url);
        $('.group-tabContent').show();
        return false;
    });
});

..效果很好但是我想在页面加载时显示一个微调器，我在哪里插入它？

Answer 1

在工厂功能的顶部，添加如下内容：
// Wait for window load
$(window).load(function() {
// Animate loader off screen
$("ajax-loader-reference").animate({});
});
其中“ajax-loader-reference”是您对加载器的类/ id /元素引用

Answer 2

要在新内容加载时执行某些操作，请更新行$('.group-tabContent').empty().load(url);并包含完整的函数处理程序（请参阅jQuery参考：http://api.jquery.com/load/ 如果提供了“完整”回调，则为在执行后处理和HTML插入后执行。对jQuery集合中的每个元素触发一次回调，并依次设置为每个DOM元素。）：

// add show spinner code here
...

// make request for content
$('.group-tabContent').empty().load(url, function(response, status, xhr){

    // done loading content, now hide spinner
    ...

});