обновление контента без перезагрузки страницы.
Работает почти все четко.
суть: нужно чтобы ссылка с классом nav_link тоже обновлялась, вне блока с тегами а и b... но при этом чтобы сама страница не обновлялась..
<div class="a"><div class="b">
этот текст изменится после нажатия на кнопку с классом nav_link
</div></div>
<a href="необходимая ссылка" class="nav_link">кнопка с классом nav_link </a>
$(function(){
AjaxContent.init({containerDiv:".a",contentDiv:".b"}).ajaxify_links(".nav_link");
});
var AjaxContent = function(){
var container_div = '';
var content_div = '';
return {
getContent : function(url){
$(container_div).animate({opacity:0}, //Прозрачность на 0
function(){ // загружает контент с помощью ajax
$('#gif_loader').show(); //показываем лоадер
$(container_div).load(url+" "+content_div, //загружает только выбранную часть
function(){
$(container_div).animate({opacity:1}); //возвращает прозрачность обратно на 1
$('#gif_loader').hide(); //скрываем лоадер при загрузке
}
);
});
},
ajaxify_links: function(elements){
$(elements).click(function(e){
e.preventDefault();
AjaxContent.getContent(this.href);
// return false; //предотвращает нажатие на ссылку
});
},
init: function(params){ //задает первоначальные настройки
container_div = params.containerDiv;
content_div = params.contentDiv;
return this; //выводит объект
}
};
}();