如何在从Flickr加载图像时显示微调器?

ada*_*dam 0 ajax jquery flickr

我正在使用jquery.flickr-1.0.js在我的应用程序中搜索flickr中的图像.我面临的问题是,有时flickr响应结果需要几秒钟,我想加载一个旋转的gif代替我的搜索按钮'btnRefresh',直到返回结果.我怎么能做到这一点?

jQuery(function(){   
    jQuery(".btnRefresh").livequery('click', function(){
        var number = $(this).attr("id");
        $('#gallery_flickr_'+number+'').show();
        jQuery('#gallery_flickr_'+number+'').html("").flickr({      
            api_key: "XXXXXXXXXXXXXXXXXXXX",     
            per_page: 18,
            search_text: $('input#flickr_search_'+number+'').val(),
            id: $(this).attr("id")
        });
    }); 
}); 
Run Code Online (Sandbox Code Playgroud)

All*_*nde 5

flickr插件在其选项中支持回调属性.因此,您可以在调用flickr之前显示微调器,然后在回调中隐藏它.

jQuery(function(){   
    jQuery(".btnRefresh").livequery('click', function(){
        $("#spinner").show();

        var number = $(this).attr("id");
        $('#gallery_flickr_'+number+'').show();
        jQuery('#gallery_flickr_'+number+'').html("").flickr({      
            api_key: "XXXXXXXXXXXXXXXXXXXX",     
            per_page: 18,
            search_text: $('input#flickr_search_'+number+'').val(),
            id: $(this).attr("id"),
            callback: function() {
                $("#spinner").hide();
            }
        });
    }); 
}); 
Run Code Online (Sandbox Code Playgroud)

应该这样做...假设你的页面中有一些名为spinner的东西,默认是隐藏的.