当我点击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");
});
答案 0 :(得分:0)
通过查看您的代码,我了解loading
div位于containerDiv
内。
以下行覆盖containerDiv
内的所有数据。您应该尝试将loading
div移出containerDiv
。这应该可以解决问题。
$(container_div).load(url+" "+content_div, //only loads the selected portion
希望这有帮助!