在页面上显示加载Gif链接单击

时间:2010-12-23 12:37:37

标签: jquery ajax

当我点击http://www.reverbstudios.ie上我网站上的任何顶部/主要链接时,我只是想显示一个加载gif。它有点工作,但只适用于第一次点击。后续单击不显示加载gif。

这是我从其他网站获得的代码,我对jQuery / Ajax / Javascript知之甚少:

var AjaxContent = function(){
    var container_div = ''; 
    var content_div = ''; 
    return {
        getContent : function(url){
            $(container_div).animate({opacity:0}, //Turn the opacity to 0
                    function(){ // the callback, loads the content with ajax                        
                        $(container_div).find("#loading").show();
                        $(container_div).load(url+" "+content_div, //only loads the selected portion
                        function(){                        
                           $(container_div).animate({opacity:1}); //and finally bring back the opacity back to 1
                           $(container_div).find("#loading").hide();                           
                    }
                );        
            });
        },
        ajaxify_links: function(elements){
            $(elements).click(function(){
                $('#loading').show();
                AjaxContent.getContent(this.href);
                return false; //prevents the link from beign followed
            });
        },
        init: function(params){ //sets the initial parameters
            container_div = params.containerDiv; 
            content_div = params.contentDiv;
            return this; //returns the object in order to make it chainable
        }
    }
}()

/* Ajax Content Loading Controls */
$(function(){
        AjaxContent.init({containerDiv:".content_background",contentDiv:"#text"}).ajaxify_links("#nav a");
    });

1 个答案:

答案 0 :(得分:0)

通过查看您的代码,我了解loading div位于containerDiv内。

以下行覆盖containerDiv内的所有数据。您应该尝试将loading div移出containerDiv。这应该可以解决问题。

$(container_div).load(url+" "+content_div, //only loads the selected portion

希望这有帮助!